vue组件之间的数据传递--随记

1.父组件与子组件之间的数据传递

首先：父组件里面引入了子组件，举个例子，父组件是A,子组件是B，A需要 import B from ‘子组件B的文件路径‘，

并且在注入父组件的components对象里

图1

其次调用子组件B，并将需要传递的值附在调用的子组件B上

请先忽略:letter

然后子组件B接受这个值：props:{}

2请先忽略 letter

2.子组件与父组件之间的 数据传递

子组件需要发送一个事件让父组建能够接收到---$emit

$emit将被点击元素的文本传递过去

父组件接收change这个事件

@change 父组件接收change这个事件

这边点击子组件那个元素它的文本这边就可以打印出来了~

这边点击子组件那个元素它的文本这边就可以打印出来了~

3.通过父组件实现子组件与子组件之间的数据传递

需要把子组件B里被点击元素的文本传递给子组件A

这时候父组件已经接收到子组件B传过来的文本变量letter了，组件A需要绑定这个letter,并且子组件A页面里呢需要接收这个letter ,props{}，如图“”2请先忽略 letter“”所示，并且需要watch（监听器）这个变量letter，如下图做所示：

这样就可以在子组件A里获取子组件B的letter的值了

---

状态管理模式--vuex

这是一张截图--vuex腾空出世 我需要吃透这张图

1.先要全局引入注册store,本地是在main.js引入注册的

import store from './store/travel'

new Vue({

  el: '#app',

·······

  store,

  components: { App },

  template: '<App/>'

})

2.然后创建一个store

travel.js文件

3.调用

$store.commit 调用