error de representación del botón del componente de neutrones el-table: es posible que tenga un bucle de actualización infinito en una función de representación del componente

Error:

 

Escenas a utilizar:

  Hay un subcomponente de botón en la tabla El. Cuando solo hay una pieza de datos en la tabla El, no habrá error, pero cuando los datos son más de uno, la página informará un error. Durante el proceso de depuración, fue porque la página reportó un error después de agregar este botón:

  Puede tener un bucle de actualización infinito en una función de representación de componentes

 Así que encuentre el motivo más adelante en el método getParam

<el-table :data="data.list1">

    <!-- 省略字段 -->
     <el-table-column fixed="right" header-align="center" align="left" width="100" label="操作">
              <template slot-scope="scope">
                 <!-- 这里面包了个子组件进入按钮 -->
                 <export-word :fileName="fileName" :btnName="btnName" :exportData="getParam(scope.row)">  </export-word >
                   
              </template>
      </el-table-column>
</el-table>

getParam se escribió originalmente así

export default {
    data () {
      return {
        dataForm: {
          key: ''
        },
        
        wordData: {
             
        },
      
      }
    },
    methods: {
        init(){
            //调接口 然后给this.wordData 赋值部分字段
        },
        getParam(rowObj){

            this.wordData.id = rowObj.id;
            this.wordData.date = rowObj.date;
            console.log("data==",JSON.stringify(this.wordData))
            //.......省略部分赋值
            return this.wordData;

        }
    }

  De hecho, parece que no hay problema. Debido a que this.wordData también asigna otros datos cuando la página inicializa la interfaz de llamada, wordData se define en data.

 Solución uno:

    Más tarde, descubrí que no hay problema en reemplazar el código anterior con la redefinición, no se informará ningún error, no es necesario. Eso es lo siguiente:

 getParam(rowObj){
        var wordData = new Object();
            //其他赋值
          wordData.name = this.data.name;
          wordData.age = this.data.age;
           
          // 行赋值
          wordData.id = rowObj.id;
          wordData.date = rowObj.date;
            console.log("data==",JSON.stringify(wordData))
            //.......省略部分赋值
            return wordData;

        }

   Solución dos:

   Más tarde, quiero restaurar el error. Cuando tomé una captura de pantalla del informe de error para publicar el artículo, eliminé el comentario a voluntad y descubrí que el error no se informó. ! !

   Resultó que imprimir this.wordData provocó un bucle infinito de errores. Si utilizo el código original para eliminar la impresión, estará bien.

 getParam(rowObj){

            this.wordData.id = rowObj.id;
            this.wordData.date = rowObj.date;
            //去掉打印 不会报错console.log("data==",JSON.stringify(this.wordData))
            //.......省略部分赋值
            return this.wordData;

        }

No importa cuál uses si puedes resolverlo, creo que es un poco extraño o anótalo.

Supongo que te gusta

Origin blog.csdn.net/ss_Tina/article/details/131322437
Recomendado
Clasificación