element-plus無法顯示中文問題


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')


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM