vue-treeselect 项目中应用出现的一些问题

https://vue-treeselect.js.org/    官网

npm install --save @riophae/vue-treeselect

 在页面中引入


        <template v-else-if="S_col.TYPE == 'treeSelect'">
          <div :class="['zw-block', 'zw-textleft', {'zw-no-label': !S_col.LABEL}]" >
            <treeselect :multiple="false" :options="treeOption[S_col.NAME]" :flat="false" :default-expand-level="1" v-model="FORMS_VALUE[S_col.NAME]"  :name="S_col.NAME" />
          </div>
        </template>
        
        <template v-else-if="S_col.TYPE == 'treeSelectMult'">
          <div :class="['zw-block', 'zw-textleft', {'zw-no-label': !S_col.LABEL}] " >
            <treeselect :multiple="true"  :options="treeOptionMult[S_col.NAME]"  :default-expand-level="1" v-model="FORMS_VALUE[S_col.NAME]"   :name="S_col.NAME" />
          </div>
        </template>

单选

 

多选 

 

 

 $gettree(){   //树形下拉框
        var datas = this.STRUCT;
        for(var i=0;i<datas.length;i++){
          for(var j=0;j<datas[i].CONTENT.length;j++){
            //单选
            if(datas[i].CONTENT[j].TYPE=='treeSelect'){
              var treeradio={
                name:datas[i].CONTENT[j].NAME,
                tree: datas[i].CONTENT[j].OPTION
              };
              this.FORMS_VALUE[treeradio.name] = null;  
              this.treeOption[treeradio.name] = (treeradio.tree);
            }
            //  多选
            if(datas[i].CONTENT[j].TYPE=='treeSelectMult'){
              var treecheckbox={
                name: datas[i].CONTENT[j].NAME,
                tree: datas[i].CONTENT[j].OPTION
              };
              this.FORMS_VALUE[treecheckbox.name] = [];   //多选的初始值要设置为空,因为是数组。不设置会报错
              this.treeOptionMult[treecheckbox.name] = (treecheckbox.tree);

            }
          }
        }


      },

猜你喜欢

转载自blog.csdn.net/SQY_candy/article/details/83652066