Question

我有一个名为Main.vue的主布局和一个名为Dashboard.vue的视图，这是Main.vue

<template>
  <div class="app">
      <div class="loading" v-if="loading">
        <square-loader :loading="true" color="#26A65B" size="50px"></square-loader>
      </div>

        <div class="container-fluid">
          <router-view></router-view><!--Dashboard.vue will be rendered here-->
        </div>
</template>
<script>
import SquareLoader from 'vue-spinner/src/SquareLoader.vue'

export default {
  name: 'full',
  components: {
    SquareLoader
  },
  data () {
    return {
      loading: true,
    }
  }
}
</script>

无论何时站点启动，都会显示SquareLoader。在Dashboard.vue，我有一些获取数据的请求。有什么方法可以从Dashboard.vue更新loading = false（加载属于Main.vue）？

Answer 1

您可以使用emit将数据传递到父组件。.阅读此讨论

https://forum.vuejs.org/t/passing-data-back-to-parent/1201

阅读这篇中等文章

https://medium.com/js-dojo/component-communication-in-vue-js-ca8b591d7efa

Vue：在组件之间更新数据

1 个答案: