ElementUI 组件设置全局默认值

16 篇文章 0 订阅

最近碰到个需求,要求把管理系统的所有 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 }
  }
})

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

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

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值