admin 管理员组

文章数量: 1184232
vue实战之在线翻译项目

今天，博主带来的分享是vue实战之在线翻译项目，一个小小的vue项目，用到了vue的很多基础语法，传组件等等！我们先来看下效果把！


左侧输入一种语言，右侧选择要转换的语言，点击翻译就可以得到结果！是不是很神奇！当然博主这里仅仅罗列的七八种语言！我们就以汉语来展示了！

其他语言的展示：




可以输入与可以翻译的语言有：

< option value= "en" >英语 </ option > < option value= "ru" >俄语 </ option > < option value= "ko" >朝鲜语 </ option > < option value= "ja" >日语 </ option > < option value= "es" >西班牙语 </ option > < option value= "it" >意大利语 </ option > < option value= "de" >德语 </ option >

<option value="zh">中文</option>

博主比较懒，，就贴代码理解了！

好了，接下来我们正式开始把！先说下思路吧，一个是要翻译的表格制作（组件1），另一个是翻译的结果（组件2），

这是两个不同的子组件！

使用vue脚手架的话，，我们需要做点准备工作！

第一：安装node环境：直接去node官网下载就可以了，安装超级简单，直接点下一步，安装结束之后在C盘的program files下

会有一个nodejs文件夹的！node官网：https://nodejs/en/


第二部分：脚手架的安装：这个我们需要去一下Github！

网址：https://github/vuejs/vue-cli

根据需要选择不同的包：


点击进入之后选择webpack，并且安装


选择第一个webpack点击进入：安装步骤如下：

当然了，我们还需要node、ES6的基本语法知识，在这里博主就不多说了！

本文标签： 实战 在线翻译 项目 Vue

版权声明：本文标题：vue实战之在线翻译项目 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.roclinux.cn/b/1754783995a3038089.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。