vue的iview表格某一列可修改属性

在 iView 表格的某一列中添加可修改属性，可以使用 iView 表格的 slot-scope 属性以及 iView 中的 Input 组件。具体步骤如下：

1. 在 iView 表格中的 columns 属性中添加要添加可修改属性的列，并设置 slot-scope 属性：

<template>
  <Table :columns="columns" :data="tableData">
    <template slot-scope="{row}">
      <Input v-model="row.name" @on-blur="handleBlur(row)" />
    </template>
  </Table>
</template>

<script>
export default {
  data() {
    return {
      columns: [
        {
          title: '姓名',
          key: 'name'
        },
        {
          title: '年龄',
          key: 'age'
        }
      ],
      tableData: [
        {
          name: '张三',
          age: 18
        },
        {
          name: '李四',
          age: 20
        }
      ]
    }
  },
  methods: {
    handleBlur(row) {
      console.log(row)
    }
  }
}
</script>

2. 在 iView 表格中的 template 标签中添加要添加可修改属性的内容，并设置 v-model 属性为 row 对应的属性：

<template>
  <Table :columns="columns" :data="tableData">
    <template slot-scope="{row}">
      <span slot="name">
        <Input v-model="row.name" @on-blur="handleBlur(row)" />
      </span>
      <span slot="age">
        <Input v-model="row.age" @on-blur="handleBlur(row)" />
      </span>
    </template>
  </Table>
</template>

<script>
export default {
  data() {
    return {
      columns: [
        {
          title: '姓名',
          slot: 'name'
        },
        {
          title: '年龄',
          slot: 'age'
        }
      ],
      tableData: [
        {
          name: '张三',
          age: 18
        },
        {
          name: '李四',
          age: 20
        }
      ]
    }
  },
  methods: {
    handleBlur(row) {
      console.log(row)
    }
  }
}
</script>

以上两种方法都可以实现在 iView 表格的某一列中添加可修改属性的效果。