vue表格里下方有个小＋号，点击可新增一行数据，双击表格里数据可修改

在Vue.js中创建表格并允许用户动态添加和编辑行通常涉及组件化的使用，比如`v-for`指令配合表单元素和事件处理。下面是一个简化的例子：

1. 首先，你可以使用`<template>`区域展示表格的基本结构，包括每一行的数据和一个"添加"按钮：

<template>
  <div>
    <table>
      <tr v-for="(item, index) in items" :key="index">
        <!-- 表格列 -->
        <td>{{ item.columnName }}</td>
        <!-- 双击编辑的标识，例如使用v-on dblclick="editRow(index)" -->
        <td @dblclick="editRow(index)">
          {{ item.value }}
        </td>
        <!-- 新增行按钮 -->
        <td>
          <button @click="addRow">+</button>
        </td>
      </tr>
    </table>
    <!-- 新增行输入框模版，可能会在另一个部分显示 -->
    <input v-if="showAddForm" v-model="newItem" placeholder="请输入新内容...">
  </div>
</template>

2. 然后在`script`标签中，定义`items`数组存储当前数据，并定义`editRow`和`addRow`方法：

<script>
export default {
  data() {
    return {
      items: [],
      newItem: '',
      showAddForm: false,
    };
  },
  methods: {
    editRow(index) {
      this.showAddForm = true;
      // 如果需要，可以在这里更新items[index]的数据
      this.items[index].value = this.newItem;
      this.newItem = '';
    },
    addRow() {
      if (this.newItem) {
        this.items.push({ columnName: '新字段', value: this.newItem });
        this.newItem = '';
      }
      this.showAddForm = false;
    },
  },
};
</script>

在这个例子中，点击“+”按钮会将新的`newItem`值追加到`items`数组中，而双击某行则临时切换到添加模式(`showAddForm`设为true)，用户输入的内容会被用于替换对应行的数据。