Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit95d97f1

Browse files
committed
新增国际化功能
1 parentf5c8515 commit95d97f1

File tree

6 files changed

+97
-0
lines changed

6 files changed

+97
-0
lines changed

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414
"mavon-editor":"^2.6.17",
1515
"vue":"^2.5.21",
1616
"vue-cropperjs":"^3.0.0",
17+
"vue-i18n":"^8.10.0",
1718
"vue-quill-editor":"^3.0.6",
1819
"vue-router":"^3.0.1",
1920
"vue-schart":"^1.0.0",

‎src/components/common/Sidebar.vue

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -107,6 +107,11 @@
107107
}
108108
]
109109
},
110+
{
111+
icon:'el-icon-lx-global',
112+
index:'i18n',
113+
title:'国际化功能'
114+
},
110115
{
111116
icon:'el-icon-lx-warn',
112117
index:'7',

‎src/components/common/i18n.js

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
exportconstmessages={
2+
'zh':{
3+
i18n:{
4+
breadcrumb:'国际化产品',
5+
tips:'通过切换语言按钮，来改变当前内容的语言。',
6+
btn:'切换英文',
7+
title1:'常用用法',
8+
p1:'要是你把你的秘密告诉了风，那就别怪风把它带给树。',
9+
p2:'没有什么比信念更能支撑我们度过艰难的时光了。',
10+
p3:'只要能把自己的事做好，并让自己快乐，你就领先于大多数人了。',
11+
title2:'组件插值',
12+
info:'Element组件需要国际化，请参考 {action}。',
13+
value:'文档'
14+
}
15+
},
16+
'en':{
17+
i18n:{
18+
breadcrumb:'International Products',
19+
tips:'Click on the button to change the current language. ',
20+
btn:'Switch Chinese',
21+
title1:'Common usage',
22+
p1:"If you reveal your secrets to the wind you should not blame the wind for revealing them to the trees.",
23+
p2:"Nothing can help us endure dark times better than our faith. ",
24+
p3:"If you can do what you do best and be happy, you're further along in life than most people.",
25+
title2:'Component interpolation',
26+
info:'The default language of Element is Chinese. If you wish to use another language, please refer to the {action}.',
27+
value:'documentation'
28+
}
29+
}
30+
}

‎src/components/page/I18n.vue

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<template>
2+
<sectionclass="main">
3+
<divclass="crumbs">
4+
<el-breadcrumbseparator="/">
5+
<el-breadcrumb-item><iclass="el-icon-lx-global"></i> {{$t('i18n.breadcrumb')}}</el-breadcrumb-item>
6+
</el-breadcrumb>
7+
</div>
8+
<divclass="container">
9+
<span>{{$t('i18n.tips')}}</span>
10+
<el-buttontype="primary"@click="$i18n.locale = $i18n.locale === 'zh'?'en':'zh';">{{$t('i18n.btn')}}</el-button>
11+
<divclass="list">
12+
<h2>{{$t('i18n.title1')}}</h2>
13+
<p>{{$t('i18n.p1')}}</p>
14+
<p>{{$t('i18n.p2')}}</p>
15+
<p>{{$t('i18n.p3')}}</p>
16+
</div>
17+
<h2>{{$t('i18n.title2')}}</h2>
18+
<div>
19+
<i18npath="i18n.info"tag="p">
20+
<aplace="action"href="https://element.eleme.cn/2.0/#/zh-CN/component/i18n">{{ $t('i18n.value') }}</a>
21+
</i18n>
22+
</div>
23+
</div>
24+
</section>
25+
</template>
26+
27+
<script>
28+
exportdefault {
29+
data(){
30+
return {
31+
}
32+
}
33+
}
34+
</script>
35+
36+
<style scoped>
37+
.list{
38+
padding:30px0;
39+
}
40+
.listp{
41+
margin-bottom:20px;
42+
}
43+
a{
44+
color:#409eff;
45+
}
46+
</style>

‎src/main.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,26 @@ import App from './App.vue'
33
importrouterfrom'./router'
44
importaxiosfrom'axios';
55
importElementUIfrom'element-ui';
6+
importVueI18nfrom'vue-i18n';
7+
import{messages}from'./components/common/i18n';
68
import'element-ui/lib/theme-chalk/index.css';// 默认主题
79
// import '../static/css/theme-green/index.css'; // 浅绿色主题
810
import'./assets/css/icon.css';
911
import'./components/common/directives';
1012
import"babel-polyfill";
1113

1214
Vue.config.productionTip=false
15+
Vue.use(VueI18n);
1316
Vue.use(ElementUI,{
1417
size:'small'
1518
});
1619
Vue.prototype.$axios=axios;
1720

21+
consti18n=newVueI18n({
22+
locale:'zh',
23+
messages
24+
})
25+
1826
//使用钩子函数对路由进行权限跳转
1927
router.beforeEach((to,from,next)=>{
2028
constrole=localStorage.getItem('ms_username');
@@ -38,5 +46,6 @@ router.beforeEach((to, from, next) => {
3846

3947
newVue({
4048
router,
49+
i18n,
4150
render:h=>h(App)
4251
}).$mount('#app')

‎src/router/index.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,12 @@ export default new Router({
7575
component:resolve=>require(['../components/page/DragDialog.vue'],resolve),
7676
meta:{title:'拖拽弹框'}
7777
},
78+
{
79+
// 国际化组件
80+
path:'/i18n',
81+
component:resolve=>require(['../components/page/I18n.vue'],resolve),
82+
meta:{title:'国际化'}
83+
},
7884
{
7985
// 权限页面
8086
path:'/permission',

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp