vue
vue2 vue3 state vuex....
SwaryLA
迎着朝阳,披着余晖,树树木棉,火红盛开
展开
-
vue使用elementUI中日期选择器
vue使用elementUI中日期选择器需求:默认选中近一个月的,仅能选择今天到三年前的日期,今天以后的日期不可选原创 2022-12-05 14:45:39 · 2072 阅读 · 0 评论 -
观察者模式 Observer模式
观察者Observer模式的定义:指多个对象间存在一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都得到通知并被自动更新(做出不同的动作)。这种模式有时又称作发布-订阅模式、模型-视图模式,它是对象行为型模式。原创 2022-11-22 16:11:01 · 582 阅读 · 0 评论 -
小菠萝Pinia
Pinia 是 vue 官方成员在2019年11月重新设计的一个状态存储库,它允许你跨组件/页面共享状态,并且是响应式的,类似于 vuex。现在 vuex 已经更新到4.x版本了,你可以认为 pinia 是作为 [email protected] 的一种存在。通俗的讲 :① vuex精简版 ,而且vue官方更加推荐使用。②优势又完胜于vuex,下面我们来了解下pinia。Pinia和vuex的区别:①没有mutation,只有state,getters,action【同步、异步】用来修改state...原创 2022-05-16 18:50:29 · 566 阅读 · 0 评论 -
Vue-MVVM数据双向绑定响应式原理之Object.defineProperty
具体指向哪个类这是一个全局唯一 的Watcher,这是一个非常巧妙的设计,因为在同一时间只能有一个全局的 Watcher 被计算,另外它的自身属性 subs 也是 Watcher 的数组,我们将订阅器Dep添加订阅者的操作设计在getter里面,这是为了让Watcher初始化时进行触发,因此需要判断是否要添加订阅者。我们只要在订阅者Watcher初始化的时候才需要添加订阅者,所以需要做一个判断操作,因此可以在订阅器上做一下手脚:在Dep.target上缓存下订阅者,添加成功后再将其去掉就可以了。原创 2022-09-13 15:21:06 · 407 阅读 · 0 评论 -
echarts增加loading加载效果
在调用setoption方法之前调用showLoadin()方法;之后再调用hideLoading()方法。自带showLoading()方法;原创 2022-08-30 11:29:59 · 8011 阅读 · 0 评论 -
vite中无法使用require和@无法使用的问题
vite里使用@需要在config里配置一下。2.在vite中配置一下即可。原创 2022-08-05 15:52:22 · 1147 阅读 · 3 评论 -
Vue-vben-admin Vue3+TS Axios的封装源码分析
2.tansform这个是一个对象,里面实际上包含了多个钩子函数,请求前处理数据的beforeRequestHook,请求拦截器requestInterceptors添加token,请求成功后的transformRequestData,也就是对于响应成功回来的时候如何返回数据,因为有的时候我们需要返回整个response,比如下载文件的时候,有的时候只需要返回response.data就好了,responseInterceptorsCatch,当http状态码非200时的错误处理。...原创 2022-07-29 10:49:38 · 2565 阅读 · 1 评论 -
vuex 辅助函数mapGetters基本用法
vuex 辅助函数mapGetters基本用法原创 2022-07-26 15:43:07 · 12878 阅读 · 0 评论 -
vue2动态路由权限管理总结
vue2动态路由权限管理总结原创 2022-07-26 11:25:28 · 3588 阅读 · 1 评论 -
[Violation] Added non-passive event listener to a scroll-blocking ‘mousewheel‘ event.
[Violation] Added non-passive event listener to a scroll-blocking 'mousewheel' event.原创 2022-07-08 18:15:16 · 5648 阅读 · 2 评论 -
Echarts之Lable颜色自定义
Echarts之Lable颜色自定义原创 2022-07-08 17:02:38 · 1635 阅读 · 0 评论 -
vue3 全局组件 及 ts 提示
vue3 全局组件 及 ts 提示原创 2022-07-05 13:49:06 · 10864 阅读 · 4 评论 -
Vue3 的Proxy
Vue3 的Proxy原创 2022-07-04 15:49:21 · 1104 阅读 · 0 评论 -
Vue实现锚点定位导航功能
Vue实现锚点定位导航功能原创 2022-06-30 17:05:03 · 1897 阅读 · 1 评论 -
vue3-setup语法糖 - 父子组件之间的传值
近期学习 vue3 的父子组件之间的传值,发现跟vue2的并没有太大的区别,然后发现网络上很少基于setup语法糖的教程,我这边总结一下,希望对大家有所帮助。 父组件向子组件传值的时候,子组件是通过props来接收的,然后以变量的形式将props传递到setup语法糖果中使用(defineEmits的到来!)。如下图所示:2、子组件接收方式和使用 3、效果图 vue3中子组件向父组件传递值和vue2.x的区别是vue2.x使用的是 $emit 而vue3使用的是emit,它们的传值一样原创 2022-06-27 16:24:53 · 49755 阅读 · 13 评论 -
vue3无法使用jsx问题
类型“typeof import("D:/\u9879\u76EE/00/model-dev-platform-doc/node_modules/@element-plus/icons-vue/dist/types/index")”的参数不能赋给类型“Plugin_2”的参数。至此,我们新建的这个vite项目已经全面支持jsx语法了,此时还需要在。报错一:无法使用 JSX,除非提供了 "--jsx" 标志。原创 2022-06-07 13:56:43 · 4323 阅读 · 1 评论 -
VSCode 中,TS 提示 ”无法找到 *.vue 声明文件“ 的解决方案
找了一圈都没有找到解决方案,问题最大的关键在于没有相关的声明文件,在ts项目里面,.ts文件是识别不了.vue文件,那么解决思路就是让ts文件可以识别vue文件。处理方式:在tsconfig文件中include中添加需要解析的vue文件那么就需要添加一下 .vue 类型文件的声明,步骤如下:最后,我们来看一下 VSCode 中是否还有红杠报错:如果还是不行,还有一个坑爹办法,就是卸载掉volar插件,所有报错全部消失..........此处一百个.....................原创 2022-06-07 18:58:34 · 9172 阅读 · 5 评论 -
vue3无法使用语法糖setup
卸载这个东西安装原创 2022-06-06 14:58:44 · 736 阅读 · 0 评论 -
vue3无法显示element-plus问题
原本想使用el-tree做目录,结果找了很久的原因都无法显示,并且没有任何报错,但是在调试的过程中发现el-tree使用的数据是对象形式的。刚开始以为需要解析数据,但是其他人都可以正常使用,所以尝试放其他组件,结果其他组件也都无法使用,那么很有可能是挂载出现问题。因为将所有需要挂载使用的变量放在了一个use里导致的,还是得多熟悉才行。并且还报了el-tree组件无法解析。原创 2022-06-06 14:55:36 · 1889 阅读 · 0 评论 -
el-select点击空白区下拉框消失
el-cascader:可以给el-cascader绑定一个@blur事件然后执行 this.$refs.area.dropDownVisible = false这条语句<el-cascader ref="area" v-model="addForm.idList" :props="defaultParams" :options="treeList" clearable原创 2022-05-25 19:18:36 · 1697 阅读 · 0 评论 -
vue页面不显示
-某个页面东西忘记了没写完......--哪里挂载vue上的什么东西干扰到。--检查路由配置,书写书否规范正确。页面死活不显示以及不报任何错误。--查找是否有中文路径。2.不要使用中文路径。原创 2022-05-25 10:04:23 · 4885 阅读 · 2 评论 -
【vue】关于实时获取input值的三种方法
vue自动获取实时获取input的data信息第一种<div id="app"> <input type="text" v-model="message"> <h2>{{message}}</h2> </div> <script src="vue.js"></script> <script> const app = new Vue(原创 2022-05-24 16:31:35 · 6465 阅读 · 0 评论 -
vue 防止重复执行点击事件
在vue项目中防止用户在一定时间内频繁点击按钮触发事件方法一: 在规定时间内将按钮禁用的方法:主要思想就是禁止用户在一定的时间多次点击,在一定时间内将按钮禁用,用定时器实现,一定时间之后用户可再次点击。<template> <div> <div @click="clickHandle()">我是点击事件</div> </div></template> <script>expor.原创 2022-05-24 13:35:38 · 4111 阅读 · 3 评论 -
VUE手风琴
手写的手风琴,这是效果图,如下<div v-for="(item,index) in listData" :key="index"> //一级 title <div @click="oneIndexChange(index, item)"> <img v-if="oneIndex == index"/> <img v-esle/> </div> <d原创 2022-05-16 10:46:58 · 505 阅读 · 0 评论 -
vue路由设置报错
[Vue warn]: Unknown custom element: <router-Link> - did you register the component correctly?报错原因:路由没有注册Vue.use(VueRouter)解决完之后再次出现问题:Missing required prop: "to" found in ---> <RouterLink>Error in render: "TypeError: Canno原创 2022-05-16 10:29:58 · 2212 阅读 · 0 评论 -
watch监听
一个数据影响多个数据,异步监听或者功能被多次需要时使用浅监听写法一msg:function(newV,oldV){ console.log(newV,oldV)},写法二msg(newV,oldV){ console.log(newV,oldV)},监听对象中的某一个值"obj.msg":function(newV,oldV){ console.log(newV,oldV)}要监听整个objobj(newV,oldV){ console...原创 2022-01-06 17:02:02 · 256 阅读 · 0 评论