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')
        }
      }
    })
    

      

    
    

     

 

posted @ 2018-08-07 16:05  dfgfgf  阅读(339)  评论(0编辑  收藏  举报