![](https://img-blog.csdnimg.cn/20190927151101105.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
VUE
文章平均质量分 63
学习笔记
阿瞒有我良计15
再长的路一步步也能走完,再短的路不迈开双脚也无法到达!
展开
-
Vue3详解
什么是hook?—— 本质是一个函数,把setup函数中使用的Composition API进行了封装。类似于vue2.x中的mixin。自定义hook的优势: 复用代码, 让setup中的逻辑更清楚易懂。封装:src - hooks - xxx.js(里面写功能函数),eg: usePoint.js。原创 2023-09-07 15:18:26 · 609 阅读 · 0 评论 -
Vue Router路由管理器
安装。原创 2023-06-04 21:51:13 · 639 阅读 · 0 评论 -
Vuex详解
3.组件中修改vuex中的数据:$store.dispatch('action中的方法名',数据) 或 $store.commit('mutations中的方法名',数据)mapMutations方法:用于帮助我们生成与。目的:让代码更好维护,让多种数据分类更加明确。中的数据需要经过加工后再使用时,可以使用。mapState方法:用于帮助我们映射。开启命名空间后,组件中读取。开启命名空间后,组件中读取。开启命名空间后,组件中调用。开启命名空间后,组件中调用。对话的方法,即:包含。对话的方法,即:包含。原创 2023-05-24 20:11:46 · 542 阅读 · 0 评论 -
Vue中的Ajax
vue脚手架配置代理服务器:方法一:在中添加如下配置:说明: 方法二:说明:下载一下所需要的课件资料:vue脚手架配置代理服务器方法一:启动server1,server2App.vuevue.config.js运行结果:什么是跨域问题?如何解决跨域问题? vue脚手架配置代理服务器方法二:启动server1,server2App.vue vue.config.jsmain.js运行结果:2.GitHub用户搜索案例App.vuemain.jsLis原创 2023-05-22 20:09:56 · 1186 阅读 · 0 评论 -
尚硅谷Vue配套资源
【代码】尚硅谷Vue配套资源。原创 2023-05-14 10:03:54 · 128 阅读 · 0 评论 -
使用Vue CLI脚手架
组件的自定义事件:1.一种组件间通信的方式,适用于:==子组件 > 父组件2.使用场景:A是父组件,B是子组件,B想给A传数据,那么就要在A中给B绑定自定义事件(事件的回调在A中)3.绑定自定义事件:1.第一种方式,在父组件中: 或 ...mounted(){3.若想让自定义事件只能触发一次,可以使用once修饰符,或$once方法。原创 2023-05-12 21:34:23 · 781 阅读 · 2 评论 -
Vue组件化编程
当应用中的功能都是多组件的方式来编写的,那这个应用就是一个组件化的应用。当应用中的 js 都以模块来编写的,那这个应用就是一个模块化的应用。Vue的实例对象,以后简称vm。原创 2023-04-16 15:23:57 · 598 阅读 · 0 评论 -
Vue生命周期
【代码】Vue生命周期。原创 2023-04-14 23:03:32 · 242 阅读 · 0 评论 -
过滤器和自定义指令
指令名如果是多个单词,要使用kebab-case命名方式,不要用camelCase命名。directives:{指令名:配置对象}directives:{指令名:回调函数}作用:向其所在的节点中渲染文本内容。指令定义时不加“v-”,但使用时要加“v-”所在节点在初次动态渲染后,就视为静态内容了。所在结构的更新,可以用于优化性能。会替换掉节点中的内容,以后数据的改变不会引起。原创 2023-04-14 13:16:47 · 339 阅读 · 0 评论 -
Vue收集表单数据
【代码】Vue收集表单数据。原创 2023-04-10 14:50:10 · 562 阅读 · 0 评论 -
Vue监测数据改变的原理
特别注意:Vue.set() 和 vm.$set() 不能给vm 或 vm的根数据对象(data等) 添加属性。2.如何监测对象中的数据?(通过setter实现监视,且要在new Vue时就传入要监测的数据)3.如何监测数组中的数据?(通过包裹数组更新元素的方法实现,本质就是做了两件事:)这个实实在在的是把数据改了,只不过,vue没有监测到。1.vue会监视data中所有层次的数据。点击按钮更新人员信息。原创 2023-04-08 15:51:20 · 920 阅读 · 0 评论 -
列表渲染,key作用与原理,列表过滤,列表排序
若对数据进行逆序添加、逆序删除等破坏顺序操作:会产生没有必要的真实DOM更新 ==> 界面效果没问题, 但效率低。如果不存在对数据的逆序添加、逆序删除等破坏顺序的操作,仅用于渲染列表,使用index作为key是没有问题的。旧虚拟DOM中未找到与新虚拟DOM相同的key:创建新的真实DOM,随后渲染到到页面。若虚拟DOM中内容变了, 则生成新的真实DOM,随后替换掉页面中之前的真实DOM。若结构中还包含输入类的DOM:会产生错误DOM更新 ==> 界面有问题。方法一:使用监听属性。方法二:使用计算属性。原创 2023-04-02 10:30:26 · 232 阅读 · 0 评论 -
条件渲染.
注意:v-if可以和v-else-if、v-else一起使用,但要求结构不能被打断。使用v-if的时,元素可能无法获取到,而使用v-show一定可以获取到。特点:不展示的DOM元素直接被移除。适用于:切换频率较低的场景。原创 2023-03-31 08:34:54 · 38 阅读 · 0 评论 -
计算属性与监视属性
2.原理:底层借助了0bjcet.defineproperty方法提供的getter和setter.实现一个姓名案例:(我们期望通过3种方式对比,得出vue为什么要使用计算属性)1.当被监视的属性变化时,回调函数自动调用,进行相关操作。1.定义:要用的属性不存在,要通过已有属性计算得来。延时1秒显示,只能用watch实现,计算属性实现不了。4.优势:与methods实现相比,内部有。2.监视的属性必须存在,才能进行监视!(复用),效率更高,调试方便。3.get函数什么时候执行?原创 2023-03-30 20:22:53 · 169 阅读 · 0 评论 -
事件处理,事件修饰符,键盘事件
2.Vue未提供别名的按键,可以使用按键原始的key值去绑定,但注意要转为kebab-case(短横线命名)4.Vue.config.keyCode.自定义键名 = 键码 ,可以去定制按键别名。3.系统修饰键(用法特殊): ctr1、alt、 shift、meta。原创 2023-03-29 13:01:53 · 135 阅读 · 0 评论 -
Vue数据代理
通过Object.defineProperty()把data对象中所有的属性添加到vm,为每一个添加到vm上的属性都指定一个getter,setter内部去操作(读/写)data中对应的属性。作用:number和person是俩个东西,但是通过Object.defineProperty方法,使这俩个东西产生了关联。通过object2能够访问(修改,读取)object1的x。通过vm对象来代理data对象中属性的操作(读/写)更加方便的操作data中的数据。原创 2023-03-29 10:36:26 · 40 阅读 · 0 评论 -
el与data的俩种写法
如何选择:目前哪种写法都可以,以后学习到组件时,data必须使用函数式,否则会报错。原创 2023-03-29 09:13:28 · 41 阅读 · 0 评论 -
Vue基本语法与数据绑定(单向,双向)
2. 双向绑定: v-model数据不仅能从data流向⻚面,也能从⻚面流向data。可以明显看到单向数据绑定,视图驱动不了数据 ,但是数据能够驱动视图。1. 单向绑定: v-bind 数据只能从data流向⻚面。注意: vue中的所有指令都是以“v-”开头的。值改变了,数据驱动视图。原创 2023-03-27 17:23:52 · 398 阅读 · 0 评论 -
第一个VUE程序
只要用到vue插件就会变亮!数据驱动视图,视图驱动数据~原创 2023-02-27 17:13:10 · 45 阅读 · 0 评论