Ant Design Vue es uno de los marcos de vue más populares. Muestra principalmente el uso simple de a-tree-select. El componente a-tree-select se utiliza principalmente para mostrar la selección de la estructura de árbol.
<plantilla>
<a-spin :spinning="confirmLoading">
<a-form :form="form">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="nombre del elemento">
<a-input placeholder="Ingrese el nombre del artículo" v-decorator="['goodsName', {}]" />
</a-form-item>
<a-form-item
:labelCol="labelCol"
: wrapperCol ="wrapperCol"
label="tipo de elemento">
<a-tree-select
style="ancho:
:replaceFields="{label: 'nombre', clave: 'val',valor: 'val' }"
show-search
treeDefaultExpandAll
tree-node-filter-prop="title"
placeholder="请选择物品类型"
:getPopupContainer= "(nodo) => nodo.parentNode"
v-decorator.trim="[ 'goodsType', validatorRules.required]">
</a-tree-select>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="物品品相">
<a-input-number v-decorator="[ 'goodsPx',{}]" />
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="Si está en los estantes">
label="Precio original del artículo">
<a-input-number v-decorator="[ 'originalPrice', {}]" />
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label= "物品现价">
<a-input-number v-decorator="[ 'goodsPrice', {}]" />
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol= "wrapperCol"
label="是否有效">
<a-input-number v-decorator="[ 'isValid', {}]" />
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
</a-form-item>
<a-input-number v-decorator="[ 'isSail', {}]" />
</a-form>
</a-spin>
</template>
