iview控件Select和Cascader回显

效果图如上，交互：
点击户口所在地是Cascader选择器，但数据有从word文档导入进来的文字，匹配不上Cascader，所以我就用的placeholder回显。
点击部门会弹出弹窗，弹窗里面是个el-tree可多选，确定后把文字传回来显示在select上，同理用的placeholder回显。

<FormItem label="户口所在地:" prop="registeredAddress" class="classForm1">
  <Cascader
    change-on-select
    v-model="registeredAddress"
    :data="regionList"
    :load-data="loadAreaData"
    :placeholder="form.registeredAddress !== '' ? form.registeredAddress : '请选择'"
    :class="form.registeredAddress === '' || form.registeredAddress === undefined ? '' : 'select'"
  />
</FormItem>
<FormItem label="部门:" prop="deptNames" class="classForm1" @click="selectDept">
  <div @click="selectDept">
    <Select 
      :placeholder="form.deptNames === '' ? '请选择' : form.deptNames" 
      :class="form.deptNames === '' || form.deptNames === undefined ? '' : 'select'" />
  </div>
</FormItem>

/deep/.select .ivu-select-placeholder {
  color: #000 !important;
}
// cascader控件去检查元素后发现是在input框的placeholder里面
/deep/.select .ivu-input::-webkit-input-placeholder {
  color: #000 !important;
}

我在度娘上面搜了很久都是input框的设置，没有改变select和cascader的，所以我就专门记录下来啦~

分享：今日教师节发微信问候了下我高中的老班儿，很感谢他那时对我的照顾，希望他一切都好。❤