Vue組件重新渲染(強制刷新)的方案

1.刷新整個頁面

  1. 使用v-if

3.使用this.$forceUpdate()方法

4.使用key-changing優(yōu)化組件

1===>

  • this.$router.replace
  • window.reload()
  • router.go(0)

2===>
不做解釋

3===>
vue 組件強制刷新
場景：echarts組件不能及時刷新，組件內容不顯示，代碼改變后顯示。

this.$forceUpdate()

4===>
給需要刷新的內容綁定一個key
場景：數(shù)據(jù)更新后表格錯位，重新加載后才恢復原樣。

        <el-table
            :data="list"
            :span-method="objectSpanMethod"
            border
            height="380"
            style="width: 100%;"
            :key="key"
        >
        .......................
        </el-table>

props: {
        thead: {
            type: Array,
            default: () => []
        },
    },
    watch:{
      thead(){
          this.key += 1 
      }
    },
    data() {
        return {
            key:0
        }
    },

參考

?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成，瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發(fā)布，文章內容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

友情鏈接更多精彩內容