packages/agQuery/src/index.vue

@@ -10,8 +10,7 @@
             <ag-row>
                 <ag-col :span="12" v-for="(item,index) in inputs" :key="index">
                 <el-form-item :label="item.label" :rules="item.rules" :prop="item.name">  
-                    <ag-input :placeholder="item.placeholder" :value="item.value||''" closeable v-if="item.elem=='el-input'" @change="onSelect($event,item,index)"/>
-                    <ag-select :placeholder="item.placeholder" :value="item.value||''" closeable v-if="item.elem=='el-select'" :options="item.options" style="width:100%" @change="onSelect($event,item,index)"/>
+                    <ag-select :placeholder="item.placeholder" :value="item.value||''" closeable :options="item.options" style="width:100%" @change="onSelect($event,item,index)"/>
                 </el-form-item> 
             </ag-col> 
          </ag-row>
@@ -53,6 +52,15 @@
           return [];
         },
       }, 
+      props:{
+        type: Object,
+        default: () => {
+          return { 
+            lazyLoad (node, resolve) { 
+            }
+          };
+        }, 
+      }
     },
     model: {  
       prop: 'values', // 明确指定 prop 为 'value'  
@@ -61,6 +69,11 @@
      mounted(){  
        let newinput=this.inputs.map((g)=>g.label); 
        this.placeholder="请选择"+newinput.join("/");
+       if(this.props.lazyLoad){
+             this.props.lazyLoad({level:0,pathLabels:this.values,value:""},(datas)=>{
+                this.inputs[index+1].options=datas;
+              }); 
+       }
     },
     data() {
       return {
@@ -68,7 +81,6 @@
         placeholderValue:"",
         placeholder:"请选择",
         popState:false, 
-        
       }
     }, 
     methods: {
@@ -80,6 +92,7 @@
           item.value=value;   
           this.$set(this.inputs,index,item);
           let newvalues={};
+         
           let newplaceholderValue=[];
             this.inputs.map((g)=>{
               if(g.value&&g.name){
@@ -87,10 +100,13 @@
                 g.options.find((f)=>f.value==g.value).label&&(newplaceholderValue.push(g.options.find((f)=>f.value==g.value).label)); 
               } 
             });
+            this.values=newvalues;
             if(this.$listeners.change){
               this.$emit('change',newvalues);
             }
-              this.values=newvalues;
+            this.props.lazyLoad({level:index+1,pathLabels:newvalues,value},(datas)=>{
+                this.inputs[index+1].options=datas;
+              }); 
             this.placeholderValue=newplaceholderValue.join("/")
       },
       onCancel(){

src/App.vue

@@ -218,7 +218,7 @@ export default {
         },
         {
           label:"型号",
-          elem:'el-select',
+          elem:'el-input',
           name:"model",
           options: []
         },