🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
[TOC] ## datacom 1. datacom组件是一种数据驱动的 2. `datacom`,全称是`data components`,数据驱动的组件。 3. 一般使用 v-model 方式进行双向绑定,可参看 v-model 的使用 示例 ``` <template> <!-- 传入符合 datacom 规范的数据,即可渲染出一组 checkbox --> <!-- 使用 v-model 双向绑定 checkbox 的选中值 --> <uni-data-checkbox v-model="value" :localdata="options" multiple></uni-data-checkbox> </template> <script> export default { data() { return { value: ['sh'], options: [ {value: 'bj',text: '北京'}, {value: 'sh',text: '上海'}, {value: 'gz',text: '广州'} ], }; }, }; </script> ``` 好处 1. 更少的代码量。从前述的传统写法对比可见,使用datacom的前端页面,代码量可减少一半以上。 2. 设计更加清晰。服务器端给符合规范的数据,然后接受选择的结果数据。中间的ui交互无需关心。 3. 结合[uni-forms](https://ext.dcloud.net.cn/plugin?id=2773)组件,自动实现表单校验。 4. 搭配 uniCloud 的[unicloud-db组件](https://uniapp.dcloud.io/uniCloud/clientdb),数据库查询结果直接绑定给`datacom组件`,服务器代码直接就不用写了 5. 搭配 uniCloud 的[schema2code页面生成系统](https://uniapp.dcloud.net.cn/uniCloud/schema?id=autocode),数据库定义好schema,前端页面就不用写了,自动生成 6. 互操作性。可以轻易的切换更好的组件