Vue重要知识小结

vue前端

  • sync修饰 (1)双向数据绑定,父子组件之间信息的交互 vue

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

    (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⃣️经过依赖注入 this

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

  • method方法 调用方法的时候,若是不传递值的话,那么能够不用加入() code

  • 混入 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')
    }
  }
})
相关文章
相关标签/搜索