关于前端:Vue-强制组件重新渲染

4次阅读

共计 434 个字符,预计需要花费 2 分钟才能阅读完成。

在 vue 中咱们可能会有很多业务援用一个组件

举个例子

比方数学有 10 中不同类型的 tab 题,然而援用的是一个公共组件
这个时候咱们 tab 切换的时候就会报出组件的 name 值谬误,或者组件并没有从新渲染,
这时候咱们须要销毁组件

形式一

利用 key 值

<component 
:is="getComponentTag(bookContent.type)"
:key="componentKey">
  data: function () {
    return {componentKey:0,};
  },
  tabClick: function (item) {this.componentKey += 1;}

办法二

v-if
<component v-if="renderComponent">
tabClick: function (item) {
 this.renderComponent = false;    
    this.$nextTick(() => {
      // 在 DOM 中增加 component 组件
      this.renderComponent = true;
    });
  }
正文完
 0