资讯专栏INFORMATION COLUMN

Vue 笔记三:Vue2.0与1.0的区别

Big_fat_cat / 1520人阅读

摘要:升级的区别与的断层式升级不同,延续了自己的风格。在命名方式和上有一些区别,掌握它们是你升级整个项目的关键。以下内容都是来源于个人项目的一些经验之谈,并非系统性的阐述。总目录前端经验收集器转载自个人建了前端学习群,旨在一起学习前端。

升级的区别

与angular的断层式升级不同,vue延续了自己的风格。在命名方式和API上有一些区别,掌握它们是你升级整个项目的关键。以下内容都是来源于个人项目的一些经验之谈,并非系统性的阐述。如果需要系统的说明,参考官网。

从 Vue 1.x 迁移

从 Vue Router 0.7.x 迁移

从 Vuex 0.6.x 迁移到 1.0

命名方式的不同

参考聊聊 Vue 组件命名那些事,Vue的关键字有所变化。一方面,你要注意大小写。另一方面,你要控件命名的过程中避免关键字,参考[[Vue warn]: Do not use built-in or reserved HTML elements as component id: text](https://github.com/sebastian-...,在1.0中并不会出现这样子的问题。

API的变化

[[译] Vue 2.0 的变化(一)之基本 API 变化](https://segmentfault.com/a/11...

[[译] Vue 2.0 的变化(二)之其他重大更改](https://segmentfault.com/a/11...

详情参考英文原文[vue 2.0 Changes](https://github.com/vuejs/vue/issues/2873)。

render格式的必需性

在2.0中,每个vue文件当中必须要有一个template。而1.0可以不需要。

Vue2.0构建工具

以下两个项目都支持Vue1.0和2.0。

vue cli

官方尤大出品,使用vue cli创建项目,有五种模板满足你的需求,分别是:

webpack 运用webpack打包 + 测试

webpack-simple 运用webpack打包

browserify 运用browserify打包 +测试

browserify-simple 运用browserify打包

simple - 最简单的html文件

使用方法

其中初始化init的过程中,webpack-simple是指webpack的简易模板,可以被替换。

npm i vue-cli -g
vue init webpack-simple projectname
Cooking

饿了么出品,提供两种模板,文档:

simple 单页面Vue项目

multiple-pages-vue 多页面Vue项目

使用方法

其中创建create的过程中,vue指的是单页面的vue模板,可以被替换。

npm i cooking-cli -g
cooking create my-project vue
cd my-project && cooking watch
cooking build
Vue2.0样例

github源码在此,记得点星:
https://github.com/brandonxiang/vue-leaflet-sync

该项目由vue 2.0开发

转载,请表明出处。总目录前端经验收集器

转载自:http://www.jianshu.com/p/3b9e...

个人建了前端学习群,旨在一起学习前端。纯净、纯粹技术讨论,非前端人员勿扰!入群加我微信:iamaixiaoxiao。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/86881.html

相关文章

  • 踩坑:Vue2.01.0命名区别

    摘要:今天在中使用时,控制给了这个警告两种解决办法在里面添加代码使用之前用的时候,都没有这个警告,经查阅相关资料得知升级后才会出现这个问题,这里涉及变量命名的问题,组件的名称最好不要和原生标签相同。 There are only two things in Computer Sciences: cache invalidation and naming things. ---Phil Kar...

    zhkai 评论0 收藏0
  • vue1.0vue2.0区别(一)

    摘要:和区别二绑定一次已废弃请使用绑定代码写法已废弃请使用循环数组默认通过进行遍历遍历需加不加重复数据不绑定通过进行遍历苹果橘子香蕉写法已废弃对象和已废弃对象数组都可以进行解构赋值必须进行定义,不然会报错事件按钮香蕉苹果橘 vue1.0和vue2.0区别(二) 绑定一次 {{*msg}} {{msg}} vue2.0已废弃 请使用v-once 绑定html代码 {{{msg}}}{{{msg...

    chanthuang 评论0 收藏0
  • 前方来报,八月最新资讯--关于vue2&3最佳文章推荐

    摘要:哪吒别人的看法都是狗屁,你是谁只有你自己说了才算,这是爹教我的道理。哪吒去他个鸟命我命由我,不由天是魔是仙,我自己决定哪吒白白搭上一条人命,你傻不傻敖丙不傻谁和你做朋友太乙真人人是否能够改变命运,我不晓得。我只晓得,不认命是哪吒的命。 showImg(https://segmentfault.com/img/bVbwiGL?w=900&h=378); 出处 查看github最新的Vue...

    izhuhaodev 评论0 收藏0
  • 2017年2月份前端资源分享

    平日学习接触过的网站积累,以每月的形式发布。2017年以前看这个网址:http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二维码 十大经典排序算法(带动图演示) 为什么知乎前端圈普遍认为H5游戏和H5展示的JSer 个人整理和封装的YU.js库|中文详细注释|供新手学习使用 扩展JavaScript语法记录 - 掉坑初期工具 汉字拼音转换...

    lily_wang 评论0 收藏0

发表评论

0条评论

Big_fat_cat

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<