1. 控件命名的问题
之前控件的字段渲染,是在代码 RxField.vue 中实现的。代码写法如下:
<view v-if="attr.control=='rx-textbox'">
<rx-input v-model="data[attr.name]" :attr="attr" :permission="permission" :metadata="metadata" :subname="subname"
:readonly="readonly" :data="data"/>
</view>
<view v-else-if="attr.control=='rx-number'">
<rx-number v-model="data[attr.name]" :attr="attr" :permission="permission" :metadata="metadata" :subname="subname"
:readonly="readonly" :data="data"/>
</view>
这种写法比较麻烦,每增加一个控件,都需要修改这个代码,对扩展不是很友好。
因此我们在编写代码的时候采用如下的代码替代上面的写法。
<component v-bind:is="attr.control"
v-model="data[attr.name]" :attr="attr" :permission="permission" :metadata="metadata" :subname="subname"
:readonly="readonly" :data="data"
></component>
在这里我们使用动态组件来实现。关键代码 v-bind:is="attr.control"
这个 attr.control
表示为控件的类型。因此我们在编写控件的时候,控件的名称需要和 这个attr.control 保持一致。
比如:
地址控件:
//地址控件
export default {
name: "rx-address",
//附件控件
export default {
name: "rx-upload",
在编写代码一定要注意这个问题。
文档更新时间: 2021-09-10 22:55 作者:zyg