通过vue.js将数据从模态表单添加到表中

，可以通过以下步骤实现：

首先，确保已经在项目中引入了vue.js，并创建了一个Vue实例。
在Vue实例中，定义一个数据对象，用于存储表单中的数据。例如：

data() {
  return {
    formData: {
      name: '',
      age: '',
      email: ''
    },
    tableData: [] // 用于存储表格数据的数组
  }
}

在模态表单中，使用v-model指令将表单元素与数据对象中的属性进行双向绑定。例如：

<input v-model="formData.name" type="text" placeholder="姓名">
<input v-model="formData.age" type="number" placeholder="年龄">
<input v-model="formData.email" type="email" placeholder="邮箱">

在提交按钮的点击事件中，将表单数据添加到表格数据数组中。例如：

methods: {
  addToTable() {
    this.tableData.push(this.formData);
    // 清空表单数据
    this.formData = {
      name: '',
      age: '',
      email: ''
    };
  }
}

在表格中，使用v-for指令遍历表格数据数组，将数据渲染到表格中。例如：

<table>
  <tr v-for="(item, index) in tableData" :key="index">
    <td>{{ item.name }}</td>
    <td>{{ item.age }}</td>
    <td>{{ item.email }}</td>
  </tr>
</table>

这样，当用户在模态表单中填写完数据并点击提交按钮时，数据将被添加到表格数据数组中，并通过v-for指令渲染到表格中显示出来。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云数据库（TencentDB）。