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