Vue重要知识小结

vue

• sync修饰 （1）双向数据绑定，父子组件之间信息的交互

  1⃣️在自组件中使用this.emmit('toFather'),子组件产生一个tofather事件，然后在父组件中通过@进行监听，那么可以实现通信过程  2⃣️使用简单的方式传递，如上图中emmit(update:title),然后在v-bind:title.sync='title',从而实现双向数据绑定

  （2）双向数据绑定，使用v-model

  通过在自组件中使用model 定义 prop event ，从而可以实现父子组件之间通过v-model实现通信，或者不定义model ，使用默认的的prop：value，enent：input

• keep-alive <keep-alive><My-component /> <keep-alive>  可以实现缓存

• 作用域插槽 这个其实就是可以使用自组件中的数据，使用slot-scope接受自组件中的数据

• 自组件访问父级组件 1⃣️ let father = this.$parent 2⃣️通过依赖注入

• 计算属性 刚开始在学习计算属性的时候，一直默认的认为是一个函数，但是在调用的时候，是不用加（）的，这样的话，在认为是一个函数就不对了，其实就是类似于 data中的数据，只不过会有缓存和更新。例如使用的时候直接{{computed}},通俗的说，可以单纯的将它作为一个data值

• method方法 调用方法的时候，如果不传递值的话，那么可以不用加入（）

• 混入 minxins

自定义指令 通过Vue.directive(name,{}) Vuex

• 三部分构成 state actions mutations

• state 此部分存放数据，可以通过mapStated获取到数据。

• actions 可以使用异步，通过this.$store.dispathc()触发

• mutatios

  mutatios 必须是同步，通过this.emmit()触发

• 步骤：

Vue.use(Vuex) const store = new Vuex.Store({ state: { //前端全栈交流学习圈：886109386 count: //针对一到五年前端开发人员 }, //帮助突破技术瓶颈，提升思维能力。 mutations: { increment (state) { state.count++ } }, actions: { increment (context) { context.commit('increment') } } })