ElementUI 组件设置全局默认值

最近碰到个需求，要求把管理系统的所有 el-select 元素都添加 clearable 属性。整个管理系统估计有几百个页面，el-select 的数量更是不计其数，如果用传统方法一个一个的找然后添加属性，绝对是不现实的。

实际上可以通过设置 ElSelect.props 的默认值，来实现全局添加默认值的功能。另外，这个方法对其他所有组件都适用（未测试）

// 默认下拉框都可以
// * 显示清除按钮
// * 输入值
// * 多选
Object.defineProperties(Element.Select.props, {
  'clearable': {
    value: { default: true, type: Boolean }
  }, 'filterable': {
    value: { default: true, type: Boolean }
  }, 'multiple': {
    value: { default: true, type: Boolean }
  }
})
1
2
3
4
5
6
7
8
9
10
11
12
13

这里通过 Object.defineProperties来修改 Element.Select.props 的对应属性的默认值，注意除了修改 default 这个属性外，还需要加上 type 来补全变量类型，如果不加的话可能会出现类型错误或者其他意料外的结果。

另外博主用 Element.Select.props.clearable.default = true 这种方式初始化默认值并没有生效，所以才改用 defineProperties 的方法。