Vue.js项目实战之多语种网站的功能实现（租车）
更新时间：2019年08月07日 08:58:04 作者：迷途纸鸢
这篇文章主要介绍了Vue.js项目实战之多语种网站（租车）的功能实现 ,需要的朋友可以参考下
首先来看一下网站效果，想写这个项目的读者可以自行下载哦，地址：https://github.com/Stray-Kite/Car：
在这个项目中，我们主要是为了学习语种切换，也就是右上角的 中文/English 功能的实现。
首先看一下模拟的后台数据src/config/modules/lang.js 文件中:
关键代码：
export default {
name: 'Homepage',
components: {
ScrollNumber
},
data () {
return {
lang: 'chinese',
pageIndex: 0,
stepIndex: 0
}
},
......其余代码 44 methods: {
addClass (el, _class) {177 //切换语言
toggleLang (lang) {
this.lang = lang
// this.animatePage()
}
},
//以下几个computed是获取config文件夹里的数据
computed: {
langs () {
return config.langs[this.lang] //主要靠这里切换，这个切换的本质其实就是使用了另一套英文的数据（换了一套后台数据）
},
......其余代码198 }
}
总结
以上所述是小编给大家介绍的Vue.js项目实战之多语种网站的功能实现（租车）,希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！
相关文章
vue v-for循环重复数据无法添加问题解决方法【加track-by=''索引''】
这篇文章主要介绍了vue v-for循环重复数据无法添加问题解决方法,结合实例形式分析了vue.js通过在v-for循环中添加track-by='索引'解决重复数据无法添加问题相关操作技巧,需要的朋友可以参考下2019-03-03
在Vue项目中,大图片和多数据Excel等大文件的上传是一个非常常见的需求，本文主要介绍了vue+ts大文件切片上传，具有一定的参考价值，感兴趣的可以了解一下2024-01-01
这篇文章主要介绍了vm.$attrs使用场景详解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-03-03
这篇文章主要给大家介绍了vue数据更新table内容不更新解决方法,文中有详细的代码示例供大家作为参考,感兴趣的同学可以参考阅读一下2023-08-08
今天小编就为大家分享一篇vue 父组件通过$refs获取子组件的值和方法详解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
今天小编就为大家分享一篇vue2.0获取鼠标位置的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-09-09
我们最开始拿到的element-ui是带有下拉箭头的,那么如何去除element-ui下拉框的下拉箭头的实现,本文就详细的介绍一下,感兴趣的可以了解一下2023-08-08
这篇文章我们从 ast 生成时调用的 baseParse 函数分析，再到 baseParse 返回 createRoot 的调用结果，一直到细化的讲解了 parseChildren 解析子节点函数中的其中某一个具体解析器的执行过程。最后通过一个简单模板举例,需要的朋友可以参考下2021-09-09
下面小编就为大家分享一篇Vue 父子组件的数据传递、修改和更新方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-03-03
这篇文章主要介绍了vuex实现及简略解析(小结)，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-03-03
最新评论