使用vue3生成一个嵌套a-input输入框的表格，不需要接收数据，只需要填写然后组成json串上送

在Vue3中，我们可以使用Element UI库提供的`<el-table>`和`<el-form-item>`组件轻松创建一个嵌套的`a-input`输入框表格，用于手动填写并生成JSON字符串。以下是简化的示例代码：

<template>
  <div>
    <form ref="form">
      <el-form :model="formData">
        <el-table :data="tableData">
          <el-table-column type="index"></el-table-column>
          <el-table-column label="Name">
            <template slot-scope="{ $index, row }">
              <el-form-item prop="children[${$index}].name">
                <a-input v-model="row.children[$index].name" placeholder="Enter name"></a-input>
              </el-form-item>
            </template>
          </el-table-column>
          <!-- 添加更多列和嵌套的input... -->
        </el-table>
        <el-button @click="submitJson">Submit JSON</el-button>
      </el-form>
    </form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      formData: {
        children: [{ name: '' }]
      },
      tableData: [...formData.children]
    };
  },
  methods: {
    submitJson() {
      const jsonStr = JSON.stringify(this.formData);
      console.log('Sending JSON:', jsonStr); // 这里可以替换为你实际发送请求的部分
    }
  }
};
</script>

在这个例子中，我们首先创建了一个表头为"Name"的列，并在其内使用了`v-model`绑定到数组内的对象属性。当你在`a-input`中输入时，数据会实时更新。点击"Submit JSON"按钮时，我们会将当前的`formData`转换为JSON字符串。

注意：你需要先安装Element UI，你可以通过npm或yarn来添加依赖：

# npm
npm install element-ui

# yarn
yarn add element-ui