使用form-create如何在界面加入一个表格啊

vue2前端项目想要使用form-create创建不同的模板,如何在form-create里添加添加表格啊

form-create 中添加表格可以通过使用官方提供的 fc-table 组件来实现。

具体步骤如下:

  1. 安装 fc-table 模块
npm install fc-table --save
  1. 在需要使用表格的页面引入组件并注册
import fcTable from 'fc-table'

export default {
  components: {
    fcTable
  },
  //...
}
  1. form-createitem 中使用 fc-table 组件

添加如下代码段,即可在表单中添加一个具有分页和排序功能的表格:

{
  type: 'fc-table',
  prop: 'tableData',
  itemProps: {
    style: {
      padding: '0 10px'
    }
  },
  options: {
    columns: [
      {
        title: '姓名',
        key: 'name'
      },
      {
        title: '年龄',
        key: 'age',
        sortable: true
      },
      {
        title: '地址',
        key: 'address',
        sortable: true
      }
    ],
    data: [],
    rowKey: 'id',
    pagination: {
      current: 1,
      pageSize: 10
    }
  }
}

其中,options 对象中的 columns 数组定义了表格的列,data 数组定义了表格的数据源,rowKey 定义了每一行数据的唯一标识符,pagination 定义了分页的初值。在表单提交时,表格中的数据会随表单数据一同提交。