master

分支 (2)

管理

管理

master

develop

element-ui-component-extension
/
I18n.html

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Element UI 扩展</title>
    <link href="./wwwroot/elementui/index.min.css" rel="stylesheet" />
    <style scoped>
    </style>
</head>
<body>
    <div id="main" v-cloak>

        <el-button v-on:click="switchLanguage('en')">English</el-button>
        <el-button v-on:click="switchLanguage('fr')">法文</el-button>
        <el-button v-on:click="switchLanguage('ja')">日文</el-button>
        <el-button v-on:click="switchLanguage('vi')">越南文</el-button>
        <el-button v-on:click="switchLanguage('zh')">中文</el-button>
        <el-button v-on:click="switchLanguage('zhhk')">粤语</el-button>
        <el-button v-on:click="switchLanguage('zhtw')">繁体中文</el-button>

        <ul>
            <li>{{ $t("extend.mescode401") }}</li>
            <li>{{ $t("extend.mescode403") }}</li>
            <li>{{ $t("extend.mescode404") }}</li>
            <li>{{ $t("extend.mescode500") }}</li>
            <li>{{ $t("extend.mescode504") }}</li>

        </ul>
        <ol>
            <li>{{ $t("extend.mescodeother") }}</li>
            <li>{{ $t("extend.confirmexit") }}</li>
            <li>{{ $t("extend.tips") }}</li>
            <li>{{ $t("extend.determine") }}</li>
            <li>{{ $t("extend.cancel") }}</li>
            <li>{{ $t("extend.changepassword") }}</li>
            <li>{{ $t("extend.logout") }}</li>
            <li>{{ $t("extend.aresureclose") }}</li>
            <li>{{ $t("extend.browserversionlow") }}</li>
        </ol>

        <ul>
            <li>{{ $t("navigateBar.hotspot") }}</li>
            <li>{{ $t("navigateBar.experience") }}</li>
            <li>{{ $t("navigateBar.focus") }}</li>
            <li>{{ $t("navigateBar.recommend") }}</li>
        </ul>
        <ol>
            <li>{{ $t("tabs.work") }}</li>
            <li>{{ $t("tabs.private") }}</li>
            <li>{{ $t("tabs.collect") }}</li>
            <li>{{ $t("tabs.like") }}</li>
        </ol>
    </div>

    <script type="text/javascript" src="./wwwroot/vue/vue.js?v=2.0"></script>
    <script type="text/javascript" src="./wwwroot/vue/vue-i18n.min.js?v=2.0"></script>
    <script type="text/javascript" src="./wwwroot/elementui/index.min.js"></script>
    <script type="text/javascript" src="./wwwroot/vue/axios.min.min.js"></script>

    <script type="text/javascript" src="./wwwroot/elementui/locale/en.js"></script>
    <script type="text/javascript" src="./wwwroot/elementui/locale/fr.js"></script>
    <script type="text/javascript" src="./wwwroot/elementui/locale/ja.js"></script>
    <script type="text/javascript" src="./wwwroot/elementui/locale/vi.js"></script>
    <script type="text/javascript" src="./wwwroot/elementui/locale/zh.js"></script>
    <script type="text/javascript" src="./wwwroot/elementui/locale/zhhk.js"></script>
    <script type="text/javascript" src="./wwwroot/elementui/locale/zhtw.js"></script>
    <script>

        // 组合语言包对象
        const messages = {en,fr,ja,vi,zh,zhhk,zhtw};
        const i18n = new VueI18n({ messages,locale: en,//locale: navigator.language // 获取浏览器的语言
        });

        var $taskVue = new Vue({
            // mixins: [localeI18n],
            el: "#main",
            i18n,
            data() {
                return {
                    menuData: [{ title: "导航1", path: "/d1", icon: "el-icon-menu", submenu: [{ title: "导航2", path: "/d2", icon: "el-icon-location", }, { title: "导航3", path: "/d3", icon: "el-icon-setting", }] },]
                }
            },
            create() {
            },
            methods: {
                switchLanguage(lang) {
                    this.i18n.currentLang = lang
                    this.$i18n.locale = lang
                }
            }
        });

    </script>
</body>
</html>