Haga clic en el botón en vue para agregar una fila de cuadros de entrada

<template>
  <div>
  <el-button @click="add">添加</el-button>
  <el-table :data="data">
  <el-table-column prop="name" label="名称">
  <template  slot-scope="scope">
  <el-input v-model="data[scope.$index].name"></el-input>
  </template>
</el-table-column>
    <el-table-column prop="age" label="年龄">
      <template  slot-scope="scope">
        <el-input v-model="data[scope.$index].age"></el-input>
      </template>
    </el-table-column>
    <el-table-column prop="age" label="年龄">
      <template  slot-scope="scope">
     <el-button @click="deleteRow(scope.$index)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
  </div>
</template>
<script>
   export  default {
    data(){
      return {
        data:[]
      }
    },
    methods:{
      add(){
        this.data.push({});
      },
      deleteRow(index){
        this.data.splice(index,1);
      }
     }
  }
</script>

 

248 artículos originales publicados · Me gusta 602 · Visita 1.08 millones +

Supongo que te gusta

Origin blog.csdn.net/qq_32963841/article/details/105436840
Recomendado
Clasificación