Vue一些重要的知识点

vue

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

  1??在自组件中使用this.emmit('toFather'),子组件产生一个tofather事件，然后在父组件中通过@进行监听，那么可以实现通信过程 
  2??使用简单的方式传递，如上图中emmit(updete: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: {
      count: 0
    },
    mutations: {
      increment (state) {
        state.count++
      }
    },
    actions: {
      increment (context) {
        context.commit('increment')
      }
    }
  })
  

  　　

   

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有