如何在Vue Js中将数据值从一个组件更改为另一组件？

Question

我是Vue Js的新手。因此，我面临着从另一个组件更改数据值的问题。

我有一个组件A：

<template>
   <div id="app">
      <p v-on:click="test ()">Something</p>
   </div>
</template>

import B from '../components/B.vue';
export default {
    components: {
        B
    },
    methods: {
        test: function() {
            B.data().myData = 124
            B.data().isActive = true
            console.log(B.data().myData);
            console.log(B.data().isActive);
        }
    }
}

成分B：

export default {
    data() {
        return {
            myData: 123,
            isActive: false

        }
    }

}

它仍然组成B数据。但是它不会受到组件B数据的影响。我想从组件A记录组件B的更改。我该怎么做？

请详细解释我。我看过vue js props属性，但我不明白。

Answer 1

您正在寻找Vuex。

它是应用程序中所有数据的集中存储。

看看他们的文档，应该很简单。