vue 点击编辑按钮，内容变成input ； 编辑 变成 保存

通过判断 当前index== / !== 选中的index; v-if v-else

DOM:

  <tr v-for="(item,index) in cameraPoints"  :key="item.id"  :label="item.name"    :value="item.id"  >
            <td align="left">
              <span v-if="editIndex !== index"> {{item.name}} </span>
              <span v-else>
                <el-input
                  v-model="inputPoint"
                  :placeholder="item.name"
                ></el-input>
              </span>
            </td>
            <td  align="center" style="display: flex;justify-content: space-around;"  >
              <el-link
                type="success"
                v-if="editIndex !== index"
                @click="edit(item, index)"
              >编辑</el-link>
              <el-link
                v-else
                type="success"
                @click="save(item, index)"
              >保存</el-link>
              <el-link
                type="danger"
                @click="remove(item, index)"
              >删除</el-link>
            </td>

          </tr>

data:

data () {
    return {
      cameraPoints: [
        { id: 11, name: '预设点01' },
        { id: 12, name: '预设点02' },
        { id: 13, name: '预设点03' },
      ],
      editIndex: 99,
      inputPoint: ''
    }

method:

  edit (item, index) {
      this.editIndex = index;
    },