基于配置

本章节主要了解FastCrud是如何通过配置驱动出一个完整的crud的。

1. FastCrud运行过程

构建crudOptions --> 调用useCrud --> 获得crudBinding --> 传入fs-crud组件

TIP

新版本将以上过程封装为了一个useFs方法，你可以一步到位

crudOptions

使用fast-crud，你只需要掌握如何配置正确的crudOptions，即可完成一个crud的开发工作。
其中 字段配置 是重点，一定要看

当你不知道crudOptions有什么参数时，请参考如下文档：

TIP

表格与配置对应关系

crudOptions.table 表格配置
crudOptions.search 查询框配置
crudOptions.pagination 分页配置
crudOptions.columns 字段配置
crudOptions.columns[key].column 表格列配置（图中columns[key]部分）
crudOptions.columns[key].search 查询表单内字段配置(图中状态字段在查询框内的配置)

表单与配置对应关系

TIP

crudOptions.form 添加表单配置
crudOptions.viewForm 查看表单配置
crudOptions.editForm 编辑表单配置
crudOptions.addForm 添加表单配置
crudOptions.columns 字段配置
crudOptions.columns.form 所有表单内该字段公共配置
crudOptions.columns.viewForm 查看表单内字段配置
crudOptions.columns.addForm 添加表单内字段配置
crudOptions.columns.editForm 编辑表单内字段配置

当你想要调整对应位置的配置，找到crudOptions里面对应的位置修改配置即可。

useCrud

主要作用是初始化crud，将crudOptions转化为crudBinding 转化过程主要做了两件事：

用户的crudOptions与公共配置、基础配置进行合并
字段配置分发，将crudOptions.columns[key]里面的form,column,search等配置分发到table.columns,form.columns,search.columns中去
- 其中viewForm、addForm、editForm与form会进行合并，然后分发到viewForm.columns、addForm.columns、editForm.columns

如此生成出来的新的Options就是crudBinding

crudBinding

在开发crud时，我们页面里面用的组件是fs-crud，crudBinding就是传入的全部参数

html

<template>
    <fs-crud ref="crudRef" v-bind="crudBinding"/>
</template>

TIP

由于fs-crud实际参数是crudBinding。
所以动态修改crudOptions里面的属性时，你会发现并不会生效。
你只能通过动态修改crudBinding里面的属性来达到目的。
当你对于crudBinding的结构不熟悉时，去手动修改它可能不是很方便。
此时你可以使用动态计算 ( 当然动态计算也有其局限性，详情请见动态计算->适用范围 )

fs-crud组件

其他的都交给fs-crud吧

基于配置 ​

1. FastCrud运行过程 ​

crudOptions ​

useCrud ​

crudBinding ​