Vue
哆啦咪唏
这个作者很懒,什么都没留下…
展开
-
Vue异步更新和nextTick的源码分析
Vue异步更新和nextTickVue是异步更新的。如果Vue中对一个Dom同时进行添加和删除的操作,这个时候到底该渲染哪一个呢?如果对于一个属性短时间内修改很多次,但我们只需要最后修改的结果。如果是同步更新,那每修改一次,就会重新渲染一次,这样就会渲染很多次(浪费性能),所以为了上面的各种问题以及性能方面,Vue是异步更新的。Vue的异步更新可以通过Vue.nextTick(vm.$nextTick)实现。Vue.nextTick和vm.$nextTick的唯一区别是回调函数中的this会自动绑原创 2021-01-26 13:17:10 · 131 阅读 · 0 评论 -
vuex
vuexstate: 存放公用数据mutations:存放store中提供用来改变state中属性的一些函数。1.通过commit触发; this.$store.commit('mutation中的函数名',传给options的参数) 2.mutations中的函数原则上必须是同步函数actions:存放的是一些用来处理异步操作的函数,但是这些函数要修改state中的数据必须通过mutations中的函数。actions中的函数通过dispatch触发this.$store.dis原创 2021-01-18 18:30:59 · 47 阅读 · 0 评论 -
vue组件通信
vue组件通信父子通信兄弟通信跨级通信父子通信:最常见的方法是 父传子,子组件通过props接收传递过来的数据,子组件传递给父组件数据是通过this.$emit触发相应事件并传递数据。父子通信还可以通过 this.$parent 和this.$children直接得到对应组件的实例。可以通过 给组件添加ref=“name”属性,然后利用this.$refs.name 直接获取对应的组件对象。2、3方法都是可以直接获得组件对象,且只能用于父子之间的通信。兄弟通信和跨级通信通过e原创 2021-01-18 11:31:06 · 132 阅读 · 1 评论 -
Vue.use和mixin
Vue.use解析//main.js import myPlugin from './components/myPlugin/index' //引入插件Vue.use(myPlugin) //默认调用myPlugin里面的install方法,如果没有则直接执行install函数//index.js//1. 插件是一个对象,有install方法export default { install(_){ // console.log(_); //就是Vue类原创 2021-01-18 10:32:10 · 725 阅读 · 0 评论 -
动态组件和 keep-alive
动态组件和 keep-alive//组件一<template> <div> 组件一 <input type="text" /> <input type="text" /> </div></template><script>export default { name: "cona", data() { return {}; },};</script>原创 2021-01-16 21:39:41 · 148 阅读 · 0 评论 -
vue之自定义指令
vue之自定义指令全局自定义指令局部自定义指令自定义指令钩子函数 :bind(第一次绑定时触发,只调用一次)unbind:只调用一次,指令与元素解绑时调用inserted (被绑定元素插入父节点时调用) ,父节点一定存在,但不能保证已经插入文档中。update :所在组件的 VNode 更新时调用,但是可能发生在其子 VNode 更新之前。指令的值可能发生了改变,也可能没有。但是你可以通过比较更新前后的值来忽略不必要的模板更新。componentUpdated(指令所在vNode及其子v原创 2021-01-16 20:39:16 · 58 阅读 · 0 评论 -
搭建vue项目
Vue项目搭建vue-cli手动配置两种方法都需要安装nodevue-cli用脚手架搭建vue项目非常简单快速,先安装vue-clinpm install vue-cli -g然后 vue init webpack 项目名 即可手动配置在命令框中cd到目的文件夹下 npm init -y 创建项目的package.json文件局部安装webpack,并进行配置npm install webpack webpack-cli -D安装webpack插件,配置webpack.config.原创 2020-06-28 18:02:11 · 81 阅读 · 0 评论