Vue学习总结
1.Object.freeze()方法可以冻结一个对象,被冻结的对象就不能再被修改。
2.Vue生命周期:beforeCreate-created-beforeMount-mounted-beforeUpdate-updated-beforeDestroy-destroyed
3.计算属性本质就是一个优化的方法,他是基于依赖的数据进行缓存,只有相关依赖发生改变才会重新执行,主要用来进行纯数据的操作。侦听属性主要用来监听某个数据的变化,从而执行回调业务逻辑。
4.过滤器可对数据进行筛选、过滤、格式化。
5.利用索引值设置数组项:Vue.set(vm.items.1,"value")
6.Vue中的数组方法:push(), pop(), shift(), unshift(), splice(), sort(), reverse(), concat(), slice(), map(), filter()
7.v-bind用于class和style时,Vue做了增强,表达式类型除了字符串外还可以使用数组和对象。
8.事件修饰符:.stop/.capture/.self/.once/.prevent/.passive。
9.按键修饰符:.enter/.tab/.delete/.esc/.space/.up/.down/.left/.right
10.系统修饰符:.ctrl/.alt/.shift/.meta
11.v-model修饰符:.lazy/.number/.trim
12.父组件的值传递到子组件使用props选项,子组件向父组件通信需要子组件触发事件,然后父组件监听这个事件。
13.插槽使用在组件中,是组件的一块html模板。
14.组件模板中必须由一个根元素包裹住所有代码,否则会报错。
15.webpack就是一个.js配置文件,在webpack中使用vue-loader可以对.vue格式的文件进行处理。
16.使用components属性进行配置,指定路由对应的组件。
17.路由两种传参方式:query传参和param传参。
18.vue router实例化后创建了两个对象:this.$router(router实例)和this.$route(当前页面的路由信息)。可以通过vm.$route获取到当前页面的路由信息,$route.query参数名的方式获取到值,$router.push()方法来导航到另外一个页面。
19.vue router中有三种导航方法:push / replace / go,常见的是使用router-link标签,等同于push方法。
20.路由传参时组件与vue router解耦方式:布尔模式解耦 / 对象模式解耦 / 函数模式解耦。
21.Vuex帮我们管理共享状态,如果不打算开发大型单页面应用,使用Vuex可能是繁琐冗余的。小项目推荐使用html5中的localStorage和sessionStroage。
22.Vuex中的对象:state对象用来管理状态;getter对象用来提取组件中对state的操作;mutation用来更改state;action对象类似mutation,只是action提交的是mutation,可以包含任何异步操作。
23.动态组件:组件之间切换的时候保持组件的状态。
24.Vue中相关指令:
双括号: 绑定文本值/使用js表达式
v-once: 渲染元素和组件一次
v-html: 输出html
v-text: 输出文本
v-bind: 绑定标签属性,缩写为:
v-on: 监听事件,缩写为@
v-slot: 插槽,缩写为#
v-cloak: 处理网络慢,vue未加载的问题
v-if/v-if-else/v-else:条件渲染
v-show: 条件渲染,如果频繁的切换则用v-show,否则用v-if
v-for: 遍历元素,默认使用就地更新,如果要跟踪每个节点,每项里面需要提供唯一的key属性
v-model: 双向数据绑定