javascript - Vuejs在更新父数据时更新子组件

Closed. This question needs details or clarity。它当前不接受答案。
                        
                    
                
            
        
            
        
                
                    
                
            
                
                    想改善这个问题吗？添加详细信息并通过editing this post阐明问题。
                
                    去年关闭。
            
        

    

我有一个显示人员详细说明的组件，该组件有一个显示其技术的表格，按下按钮时我需要更新（重画）该表格

<template>
  <div class="animated fadeIn">
    <b-row>
      <b-col xs="12" lg="12">
        <b-card>
          <div slot="header">
            Person:
            <strong>Name</strong>
            <b-button @click="Update"></b-button>
          </div>
          <b-row>
            <TransactionsTable ref="TransactionsTable"/>
            </b-row>
        </b-card>
      </b-col>
    </b-row>

  </div>
</template>

<script>
import TransactionsTable from "./TransactionsTable.vue";

export default {
 components: {
    TransactionsTable
 },
  methods: {
    Update() {
      this.$refs.TransactionsTable.$forceUpdate();
    }
  },
};
</script>

最佳答案

因为您的TransactionsTable似乎可以管理自己的状态，所以不必调用.$forceUpdate()，而是向TransactionsTable添加方法。从父级调用该方法，然后在TransactionsTable方法中更改状态。

如果正确地连接起来，您实际上永远不需要调用$ forceUpdate。