vuetranslatepeoject实现在线翻译功能【新手必看】-创新互联

 开始

成都创新互联公司电话联系:18980820575,为您提供成都网站建设网页设计及定制高端网站建设服务,成都创新互联公司网页制作领域十载,包括石牌坊等多个行业拥有丰富的营销推广经验,选择成都创新互联公司,为企业保驾护航。

这是一适合新手练习的小项目,一个在线翻译的demo。

在正式开始前,先啰嗦一下,是一位网友给我的建议,就是不要强行组件化的问题 开始做Vue时我们可能会喜欢拆很多组件出来 但记住组件是为了复用(常见如公共菜单按钮栏等) 如非能够复用的情况其实并不用真的拆出组件来 。

当然,这个项目里因为是练手,所以强行组件化来涉及更多的vue用法。

目录结构

src下新建了两个文件:TranslateForm.vue表单组件和TranslateText.vue翻译结果组件

涉及的语法

  • 指令:v-model,v-on,v-bind
  • 父子组件通信:$emit,props
  • 动态更新数据:vm.$set
  • 翻译服务的API,我这里用的是有道翻译的api

——————————————————————————————分割线————————————————————————


TranslateForm.vue



分享题目:vuetranslatepeoject实现在线翻译功能【新手必看】-创新互联
当前URL:http://pwwzsj.com/article/dgpcdo.html