ln1138932964的博客

Vue常用指令总结 v-once表示元素或组件只渲染一次，后面修改的都不再进行渲染 v-text用于输出文本 v-html用于输出 html 代码 v-for循环（迭代数组；迭代对象中的属性；迭代数字） v-if根据表达式的值的真假条件（使dom元素销毁或重建） v-else-if必须和 v-if 连用 v-else必须和 v-if 连用 v-show根据表达式的真假（切换元素的 display css属性） 经常切换某个元素的显示/隐藏时，则使用 v-shou 会更加节省性能

随着组件的细化，就会遇到多组件状态共享的情况， Vuex当然可以解决这类问题，不过就像 Vuex官方文档所说的，如果应用不够大，为避免代码繁琐冗余，最好不要使用它，今天我们介绍的是 vue.js 2.6 新增加的 Observable API ，通过使用这个 api 我们可以应对一些简单的跨组件数据状态共享的情况。 observable()方法，用于设置监控属性，这样就可以监控viewModule中的属性值的变化，从而就可以动态的改变某个元素中的值，监控属性的类型不变量而是一个函数，通过返回一个函数给vie

使用介绍: v-bind="$props": 可以将父组件的所有props下发给它的子组件,子组件需要在其props:{} 中定义要接受的props。 vm.$props: 当前组件接收到的 props 对象。Vue 实例代理了对其 props 对象属性的访问。官方介绍 v-bind="$attrs": 将调用组件时的组件标签上绑定的非props的特性(class和style除外)向下传递。在子组件中应当添加inheritAttrs: false(避免父作用域的不被认作props的特性绑定应用在子组件的根

记录一下vue中hook的两点使用 1.在同一个组件中 例如：在mounted中添加一个监听需要在beforeDistroy中移除这个监听，考虑到某些原因你不想再写个beforeDistroy去实现，这时候绿巨人hook就该登场了！ mounted(){ window.addEventListener('online',this.handleOnline) this.$once('hook:beforeDestroy',function() { window.removeEven

代码优化 模块化、组件化 - 组件是把常用的东西封装起来，最重要的就是复用。 - 模块是把同一功能或业务的代码进行分离，降低模块间的耦合性，可以独立运行和管理。 - 包括css也可以通过less和sass来减少重复代码。 v-for 的 key 在使用v-for渲染元素列表时，为每一项都设置唯一的key值，为了让Vue内部更快的定位到该条数据。 我们都知道尽量不要使用index下标作为key值，例如： let arr = [ { id: 1, title: 'one' }, { id:

1.深层选择器 有时，你需要修改第三方组件的CSS，如果您希望scoped样式选择器是“较深的”，即影响子组件，则可以使用>>>组合器： <style scoped> .a >>> .b { /* ... */ } </style> 一些预处理器（例如Sass）可能无法>>>正确解析。在这些情况下，您可以改用/deep/或::v-deep组合器-两者都是它们的别名，>>>并且工作原理完全相同。 <styl