<Select
v-model="deptId"
filterable
:only-filter-with-text="true"// //用来控制是否启用自定义的originValidateOption函数。true代表启用
clearable
>
<Option
v-for="item in deptList"
:value="item.conCode"
:key="item.conCode"
>{{ item.conName }}</Option
>
</Select>
iView.Select.props.onlyFilterWithText = {
type: Boolean,
default: false
};
iView.Select.methods.originValidateOption = iView.Select.methods.validateOption;
iView.Select.methods.validateOption = function ({children, elm, propsData}) {
if (this.onlyFilterWithText) {
const textContent = (elm && elm.textContent) || (children || []).reduce((str, node) => {
const nodeText = node.elm ? node.elm.textContent : node.text;
return `${str} ${nodeText}`;
}, '') || '';
const query = this.query.toLowerCase().trim();
return textContent.toLowerCase().includes(query);
} else {
return this.originValidateOption({children, elm, propsData});
}
};
//因为iview内部的validateOption函数不仅会匹配conName,还会匹配conCode。只要其中有一项匹配,那么这条数据就会被选中。我们现在重写iview的validateOption函数,让它只匹配conName
Vue.use(iView, {
i18n: (key, value) => i18n.t(key, value)
})