1. 程式人生 >實用技巧 >其它 >VUE中CDN方式使用國際化vue-i18n.js

VUE中CDN方式使用國際化vue-i18n.js


技術標籤:vue

1、引入

<script src="statics/libs/vue.min.js"></script>
<script src="statics/config/i18nMessages.js"></script>
<script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script>

vue-i18n要在vue之後引入

2、JS使用
i18nMessages.js 用來做配置國際化

const i18nMessages = {
	'zh_CN': {
		'hello': '你好',
	},
	'en_US': {
		'hello': 'hello',
	}
}

業務JS

	var i18n = new  VueI18n({
		locale: 'zh_CN',
		messages:i18nMessages
	})
	
    var vm = new Vue({
        el: '#loginBox',
		i18n,
        data: {
        },
        methods: {
        },
	    beforeCreate: function () {

        },
        created: function () {
           
        }
    });

HTML:

<p style="font-size:12px;color:#515a6e;">肖肖{{$t('hello')}}</p>

效果:

VUE中CDN方式使用國際化vue-i18n.js


VUE中CDN方式使用國際化vue-i18n.js