console
new Vue({
el: "#app",
data: {
loading: false,
options:[{
value: "1",
label: "好用",
disabled: true
},
{
value: "2",
label: "方便",
disabled: false
},
{
value: "3",
label: "实用",
disabled: false
},
{
value: "4",
label: "有效",
disabled: false
}],
},
computed:{
rule(){
return [ {
type: "Select",
title: "自动完成",
field: "auto2",
props: {
filterable: true,
remote: true,
remoteMethod: this.remoteMethod,
loading: this.loading
},
options:this.options
}]
}
},
methods:{
remoteMethod(query) {
if (query !== "") {
this.loading = true;
setTimeout(() => {
this.loading = false;
this.options = [{
value: "1",
label: "好用",
disabled: true
},
{
value: "2",
label: "方便",
disabled: false
}]
}, 200);
} else {
this.options = [];
}
},
}
})
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.min.js">
</script>
<script src="https://cdn.jsdelivr.net/npm/iview/dist/iview.min.js">
</script>
<script src="https://cdn.jsdelivr.net/npm/form-create@1.5.0/dist/form-create.min.js">
</script>
<div id="app">
<form-create :rule="rule" />
</div>
@import url("//cdn.jsdelivr.net/npm/iview/dist/styles/iview.css");
#app {
padding: 32px;
}