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