element-plus直接引用中文包无效解决
import { createApp,ref } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import ElementPlus from 'element-plus';
//引入elementPlus样式
import 'element-plus/lib/theme-chalk/index.css'
//右键菜单
import VueContextMenu from 'vue-contextmenu'
//解决element-plus无法显示中文问题
import zhLocale from 'element-plus/lib/locale/lang/zh-cn'
ElementPlus.useLang = (app, ref, locale) => {
const template = (str, option) => {
if (!str || !option) return str
return str.replace(/\{(\w+)\}/g, (_, key) => {
return option[key]
})
}
// 注入全局属性,子组件都能通过inject获取
app.provide('ElLocaleInjection', {
lang: ref(locale.name),
locale: ref(locale),
t: (...args) => {
const [path, option] = args
let value
const array = path.split('.')
let current = locale
for (let i = 0, j = array.length; i < j; i++) {
const property = array[i]
value = current[property]
if (i === j - 1) return template(value, option)
if (!value) return ''
current = value
}
},
})
}
const app = createApp(App)
//设置中文
ElementPlus.useLang(app, ref, zhLocale)
app.use(store).use(router).use(ElementPlus).use(VueContextMenu).mount('#app')