javascript - VueJS单文件组件更新数据

我真的对VueJS的单个文件组件中的数据工作方式感到困惑。在文件中，说test.vue，据我所知，您将写出类似以下内容的脚本：

export default {
  name: 'Testapp',
  data () {
    return {
      msg: 'sample message'
    }
  }
}

然后在其他地方，在名为vuescript.js的文件中说，我将输入以下内容，然后从html文件中调用它：

从“ vue”导入Vue
从'./test.vue'导入VApp

var vueApp = new Vue({
  el: '#app',
  render: h => h(VApp)
})

现在如何访问该模板对象的数据？我想要的是在其他地方有代码，这些代码可以从服务器中获取数据，并且可以在多个组件之间共享，因此我需要一部分数据是相同的，并且可以从单个存储库进行更新，但是我希望能够使某些设置（例如设置和其他元数据）中的未共享数据驻留在组件中。

BLUF：在研究如何在Vue单个文件组件中访问/处理数据后，我有些困惑。

最佳答案

组件内部的数据只能以两种方式在自身外部访问。任一事件会将数据向上传播给父对象，然后父对象可以决定是否需要将它作为道具传递给另一个组件。或者将其存储在Vuex中，并通过吸气剂和突变来访问。

链接

Component Props

Events

Vuex Example