草庐IT

vue+elementui

全部标签

Vue 使用技巧:优雅的进行二次封装 UI 库组件

Vue使用技巧:优雅的进行二次封装UI库组件前提概要:一、属性【Attributes】:二、自定义事件【Events】:三、插槽【Slots】:四、额外加餐`$attrs`与`$listeners`合并`$slot`与`$scopedSlots`合并参考资料:相关知识参考资料:前提概要:作为一个前端搬砖工程师经常需要搬砖,封装一些第三方组件,在添加新的属性、插槽、事件时候就会想应该怎么去保留,向外抛出封装原本第三方组件提供的属性、插槽、事件;但是如果是一个个属性和事件以及插槽进行重新声明定义,虽然也是可行的,但是未免也太过于麻烦了,并且这种做法在升级了原本依赖的UI库后某些新增或者break-

uni-app(Vue3/Vite) + vant UI(Vue3版本)+ js 按需引入的项目搭建

        因为要完成软件工程的项目,要做一个nativeApp,看了很多的技术文档以后决定使用多端兼容的uni-app来开发。组件方面的话最后决定使用目前比较火的VantUI。但是看了CSDN和掘金上面的很多文章,似乎没有一篇是关于uni-app中使用Vite对vant组件进行按需引入(可能这个搭配技术还比较新吧,好像是去年12月份完善的技术),如果按照网上的vue-cli+vant的方法配置DCloud官网中提供的uni-app的项目似乎并不可行(满屏的bug)uni-app官网,鉴于对Vant的热爱,经过本人不懈努力了2周后,终于成功的适配了! 下面就和各位分享一下如何uni-app

若依前后端分离版ruoyi-vue:增加新的登录接口(新用户表),用于小程序或者APP获取token,并使用若依的验证方法,结合腾讯云短信验证码实现手机号+验证码登陆

1.新建—SmsController类packagecom.wanuw.user.controller.login;importcom.wanuw.common.constant.Constants;importcom.wanuw.common.core.domain.AjaxResult;importcom.wanuw.user.service.SmsService;importorg.springframework.beans.factory.annotation.Autowired;importorg.springframework.web.bind.annotation.*;/***手

【源码系列#06】Vue3 Diff算法

专栏分享:vue2源码专栏,vue3源码专栏,vuerouter源码专栏,玩具项目专栏,硬核💪推荐🙌欢迎各位ITer关注点赞收藏🌸🌸🌸Vue2Diff算法可以参考此篇文章【Vue2.x源码系列08】Diff算法原理前后元素不一致两个不同虚拟节点不需要进行比较,直接移除老节点,将新的虚拟节点渲染成真实DOM进行挂载即可//判断两个虚拟节点是否是相同节点,标签名相同&&key是一样的exportfunctionisSameVnode(n1,n2){returnn1.type===n2.type&&n1.key===n2.key}//核心的patch方法,包括初始化DOM和diff算法constpa

【源码系列#06】Vue3 Diff算法

专栏分享:vue2源码专栏,vue3源码专栏,vuerouter源码专栏,玩具项目专栏,硬核💪推荐🙌欢迎各位ITer关注点赞收藏🌸🌸🌸Vue2Diff算法可以参考此篇文章【Vue2.x源码系列08】Diff算法原理前后元素不一致两个不同虚拟节点不需要进行比较,直接移除老节点,将新的虚拟节点渲染成真实DOM进行挂载即可//判断两个虚拟节点是否是相同节点,标签名相同&&key是一样的exportfunctionisSameVnode(n1,n2){returnn1.type===n2.type&&n1.key===n2.key}//核心的patch方法,包括初始化DOM和diff算法constpa

羽毛图标在vue.js中使用

我一直在尝试使用羽毛形式在一个新的VUE项目中。我首先使用Vue-Clie工具初始化了该项目:vueinitwebpack完成后,我跑了:npminstallnpmrundev之后,我通过NPM安装了羽毛形式,如下所示:npminstall--savefeather-icons完成后,我尝试通过在我的main.js文件中导入模块来使用图标:main.js:import'feather-icons'importVuefrom'vue'importAppfrom'./App'importrouterfrom'./router'Vue.config.productionTip=falsenewVue

Vue2 12月24日 迎来2.7.16终版 版本号为 Swan Song,意为绝唱

    Vue官推消息,Vue2将于2023年12月31日停止维护。2023年12月24日,vue^2.7.16版本发布,版本号为SwanSong,意为绝唱。vue2在vue的发展历程中,是一个重要的版本,是一个重要的里程碑,终版也标志着该版本的稳定和成熟。    同时维护vue3和vue2版本对vue开发团队来说,是不可持续的,创始人希望集中精力在Vue3的开发和推广上,随着vue3的生态系统的成熟,vue2正在经历一个慢慢被取代的过程。但不可否认的是,vue2框架在国内引导很大一部分前端程序员入门,在前端框架的使用几乎占据了大中小公司的半壁江山。    那么,来回顾一下vue的发展以及vu

记:vite3+vue3+axios前端项目跨域问题解决【前端和服务器nginx配置】

前言:什么是跨域,网上一搜一大把,所以这里直接跳过,直入主题。处理方式:不通过后端处理跨域,通过前端+服务器nginx处理。1.前端涉及处理跨域的必要配置(开发环境、生产环境):vite3、vue3、axios2.服务器涉及处理跨域的配置(生产环境):nginx【主要用到其配置文件nginx.conf】3.配置开发环境【跟目录下分别创建:.env.development、.env.production】        .env.development内容如下:VITE_APP_PROXY_BASE_API='/proxyCustomerApi-dev'        .env.producti

vue2中的$符号(内置变量)

$开头的变量只是Vue的命名规则,为了区分普通变量属性,避免我们自己声明或者添加自定义属性导致覆盖。一、$datavue的实例属性$data是用于获取data里数据的相当于用this获取。template>div>p>a@click="click()">$dataChangea>|a@click="click2()">thisChangea>p>p>{{data1}}p>div>template>script>exportdefault{name:"CT",data(){return{data1:'data1'};},mounted(){console.log(this.$data);},me

基于SpringBoot+vue疫情网课管理系统详细设计和实现

博主介绍:✌全网粉丝30W+,csdn特邀作者、博客专家、CSDN新星计划导师、Java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和学生毕业项目实战,高校老师/讲师/同行交流合作✌主要内容:SpringBoot、Vue、SSM、HLMT、Jsp、PHP、Nodejs、Python、爬虫、数据可视化、小程序、安卓app、大数据、物联网、机器学习等设计与开发。🍅文末获取源码联系🍅👇🏻 精彩专栏推荐订阅👇🏻 不然下次找不到哟2022-2024年最全的计算机软件毕业设计选题大全:1000个热门选题推荐✅Java项目精品实战案例《100套》Java微