## 表单组件 * 组件文档:[https://avuejs.com/doc/form/form-doc](https://avuejs.com/doc/form/form-doc) * 查看对应例子 ![](https://img.kancloud.cn/a0/5a/a05af4e36d14d4cb07b0679c3e3477a2_3838x1886.png) ![](https://img.kancloud.cn/ac/c9/acc9b49855b611f29f612240aae945cb_3834x1502.png) ![](https://img.kancloud.cn/6c/4f/6c4fb11e073d28ffd8b02bc84bf27d49_3838x1860.png) * 找一个基础的demo,进行集成 ![](https://img.kancloud.cn/4a/f3/4af348300bae9b833257a65c520b8aea_3838x1856.png) * 将代码拷贝至最开始的demo.vue文件 ![](https://img.kancloud.cn/13/3a/133a0604d061a9199ef74d744ba4d4fd_1504x1808.png) * 刷新页面点击提交,发现表单数据获取成功 ![](https://img.kancloud.cn/92/99/9299a4214146b44ff939acf252a49c1b_2150x1156.png) * 由此可见,avue的表格、表单组件都只需要配置`option`,便可以渲染出各种我们所需要的效果。若某些情况不支持,我们也可以使用slot卡槽进行配置。 * 在column中配置formslot属性,同时在<avue-form>标签内配置template卡槽,`column`的`prop`需要与卡槽的`slot`对应 ![](https://img.kancloud.cn/cb/ee/cbee441a63f852098480e2f27dd87390_1342x1388.png) * 刷新页面发现卡槽定义成功 ![](https://img.kancloud.cn/7f/dd/7fdd7cb67c1a89e39037a01f803073b3_2006x1194.png) * 这样一来,大家便可以通过卡槽来配置出各种复杂场景的组件了