lijh
2022-01-18 15bd39c66eb9c1942b72fb373fbe16865f715f04
commit | author | age
bf6fbe 1 // 子组件 childB
L 2
3 <template>
4     <div id="childB">
5         <h1>我是B组件</h1>
6         <button @click="transform">点我让A组件接收到数据</button>
7         <p>因为你点了A,所以我的信息发生了变化:{{AMessage}}</p>
8     </div>
9 </template>
10
11 <script>
12     export default {
13         data() {
14             return {
15                 BMessage: 'Hello,A组件,我是B组件'
16             }
17         },
18         computed: {
19             AMessage() {
20                 // 这里存储从store里获取的A组件的数据
21                 return this.$store.state.AMsg
22             }
23         },
24         methods: {
25             transform() {
26                 // 触发receiveBMsg,将B组件的数据存放到store里去
27                 this.$store.commit('receiveBMsg', {
28                     BMsg: this.BMessage
29                 })
30             }
31         }
32     }
33 </script>