Vue—实现中英切换

最新推荐文章于 2024-07-11 20:04:32 发布

ygkyufcl

最新推荐文章于 2024-07-11 20:04:32 发布

阅读量541

点赞数 1

分类专栏： Vue 文章标签： vue 前端

本文链接：https://blog.csdn.net/ygkyufcl/article/details/106355229

版权

本文档介绍了如何在Vue项目中实现语言切换功能，包括在`src/store/index.js`、`src/views/home.vue`及`vue.config.js`（如使用CDN）中的配置步骤，重点在于正确引入Element UI的中文和英文包。

摘要由CSDN通过智能技术生成

记得引入element的中文包、英文包

//cdn
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<link rel="stylesheet" href="https://unpkg.com/element-ui@2.13.2/lib/theme-chalk/display.css" />//用于实现响应式布局
<script src="https://unpkg.com/element-ui"></script>
<script src="https://unpkg.com/element-ui/lib/umd/locale/zh-CN.js"></script>
<script src="https://unpkg.com/element-ui/lib/umd/locale/en.js"></script>

一、src/store/index.js

import Vue from "vue";
import Vuex from "vuex";
//npm
//import ElementUI from 'element-ui'
//import locale from 'element-ui/lib/locale/lang/en'
//import ZhLocale from 'element-ui/lib/locale/lang/zh-CN'
//import enLocale from 'element-ui/lib/locale/lang/en'

Vue.use(Vuex);

export default new Vuex.Store({
   
  state: {
   
    index: 0
  },
  mutations: