使用

1虏辫、級(jí)聯(lián)選擇器動(dòng)態(tài)加載

關(guān)于字典的數(shù)據(jù)我放在了mixins中
使用的組件

<el-form-item label="所有者">
  <el-cascader :props="props" ref="owner" :placeholder="form.createName" @change="getOwner" :show-all-levels="false" style="width:100%"></el-cascader>                
</el-form-item>

import { ehrperson } from "@/mixins/paramlist"

mixins: [ ehrperson ], 
// 獲取選中葉子節(jié)點(diǎn)的值
getOwner (node) {      
  let tempObj = this.$refs.owner.getCheckedNodes()[0]
  this.form.createName = tempObj.label
  this.form.createId = tempObj.value      
},

mixins/paramlist.js
下面是調(diào)取公司瞻润，然后循環(huán)調(diào)用公司下的部門厅克，當(dāng)沒(méi)有部門后則調(diào)取部門人員

import api from "@/servers/api"
// ehr所有人員
export const ehrperson = {
  data () {
    return {
      props: {
        lazy: true,
        lazyLoad:this.cascaderLazyLoad        
      },
    }
  },
  methods: {
    cascaderLazyLoad (node, resolve) {      
      if (!node) {
        return false
      }
      const { level } = node;
      if (level === 0) {        
        let url = `?strDetail=true`
        api.ehrManage.companyNew(url).then(res => {           
          if (res.status == 200) {
            resolve(
              res.data.map((val) => {
                return {
                  value: val.id,
                  label: val.name,
                  leaf: false
                };
              })
            );
          }         
        })
      }else if (level >= 1) {        
        const orgId = node.data.value;
        if (!orgId) return resolve();        
        api.ehrManage.departmentAgain({orgId}).then(res => {                    
          if (res.status == 200) {
            if (res.data.length != 0) {
              resolve(
                res.data.map((val) => {
                  return {
                    value: val.id,
                    label: val.name,
                    leaf: false
                  };
                })
              );  
            }else {
              api.ehrManage.personnel({orgId}).then(res => {                            
                if (res.status == 200) {
                  resolve(
                    res.data.map((val) => {
                      return {
                        value: val.me.personId,
                        label: val.me.person.nameOriental ? val.me.person.nameOriental : val.me.person.surnameOriental ? val.me.person.surnameOriental : '',
                        leaf: true
                      };
                    })
                  );                      
                }
              })
            }             
          }
        })
      }            
    },
  }
}

問(wèn)題

1、clearCheckedNodes()方法如何使用

this.$refs.cascader.$refs.panel.clearCheckedNodes() // 清空選中節(jié)點(diǎn)
this.$refs.cascader.$refs.panel.activePath = [] // 清空高亮  

2清寇、回顯
回顯使用了placeholder 然后改了下樣式

.wrap-content /deep/ .el-cascader .el-input .el-input__inner::-webkit-input-placeholder{
  color: #606266;
}

網(wǎng)站導(dǎo)航

網(wǎng)站導(dǎo)航