element plus更改组件全局属性

23 阅读1分钟

通用各种版本

import { h } from 'vue'
import { ElTable } from 'element-plus'

// 使用方式:在 main.js 中 app.use(ElTableDefaults)
export default {
  install(app, options = {}) {
    const TableDefaultProps = {
      scrollbarAlwaysOn:true,
      // 示例:
      // size: 'small',
      // emptyText: '暂无数据',
      // highlightCurrentRow: false,
      ...options,
    }

    const ElTableWrapper = {
      name: ElTable.name,
      inheritAttrs: false,
      setup(_, { attrs, slots }) {
        // 后传入的 attrs 会覆盖默认值,确保局部设置优先生效
        return () => h(ElTable, { ...TableDefaultProps, ...attrs }, slots)
      },
    }

    // 以相同的组件名注册,覆盖原有的 ElTable,实现全局默认值
    app.component(ElTable.name, ElTableWrapper)
  },
}```


在main.js里
import ElTableDefaults from './plugins/el-table-defaults' // 为 ElTable 注册全局默认属性(可按需调整)
    app.use(ElTableDefaults)