一、问题：在父组件里面加载了自定义的子组件，父组件添加数据后，子组件的数据怎么跟着刷新？？？

二、解决方法：

1、原理：采用v-if会销毁组件并且重绘，这样就会重载组件

2、思路：

• 在父组件内的自定义组件：<commList v-if="hackReset == true" param="1" />
• 在父组件内的增删改查方法中操作：this.hackReset = false; 和 this.$nextTick();

$nextTick 是在下次 DOM 更新循环结束之后执行延迟回调，在修改数据之后使用 $nextTick，则可以在回调中获取更新后的 DOM。

3、代码：

<template>
  <el-container>
    <el-header>
      <div><span>校园头条</span><span class="commapp_arrow">></span><span>24小时</span></div>
    </el-header>
    <el-main class="comm-HeadlinesDiv">
      <div class="el-col-md-16 el-col-offset-4">
        <div class="hd_postListUL">
          <commList v-if="hackReset == true" param="1" />
        </div>
      </div>
    </el-main>
  </el-container>
</template>

<script>
  import { mapActions } from 'vuex'
  import commList from './commList.vue'
  import { shareContent } from '../../../api/share.js'

  export default {
    name: 'Hours',
    components: {
      commList
    },
    data() {
      return {
        hackReset: true //是否刷新评论列表
      }
    },
    methods: {
      clickPublishing() { /////////////////////////////////////////////////////////////发布按钮
          ////开始请求
          this.shareContent();
          ////刷新子组件数据
          this.hackReset = false;
          this.$nextTick(() => {
            this.hackReset = true;
          });
      },
      async shareContent() { /////////////////////////////////////////////////////////////开始请求：传参数等
        var textareaVal = this.h_editHtml;
        var visibleRangeType = this.h_visibleRangeType;
        var currentOrgID_1 = this.currentOrgID;
        var data = await shareContent({
          content: textareaVal,
          seeRange: visibleRangeType,
          orgId: currentOrgID_1,
          appType: 1,
          i_den: 'tea'
        });
      }
    }
  }
</script>