You may have an infinite update loop in a component render function.

今天遇到一個問題: You may have an infinite update loop in a component render function. 網上雖然沒有和我一模一樣的使用場景,但思想是差很少的。通過查資料終於解決,在此記錄一下。html

使用場景: el-tooltip在某些狀況下可用,某些狀況下禁用,出現上述報錯的代碼以下:瀏覽器

html:

<el-tooltip
  effect="dark"
  :content="getCartStatus(scope.row)"
  placement="top"
  :disabled="disCartTooltip">
  </el-tooltip>
  
 js:
 getCartStatus(course) {
    this.disCartTooltip = course.isInCart === 1;
 },

複製代碼

緣由是:bash

不停地更新變量狀態,須要不停地渲染。oop

解決方法: 在渲染之前更新數據狀態。在個人實例中,就是先告訴瀏覽器el-tooltip是否可用,若是可用,纔去告訴瀏覽器hover的內容是什麼。 代碼以下:this

<el-tooltip
  effect="dark"
  :content="getCartStatus(scope.row)"
  placement="top"
  :disabled="scope.row.isInCart === 1">
</el-tooltip>
  
複製代碼
相關文章
相關標籤/搜索