vue1.0和vue2.0的区别(一)
今天我们来说一说vue1.0和vue2.0的主要变化有哪些
一.在每个组件模板,不在支持片段代码
VUE1.0是:
<template>
<h3>我是组件</h3><strong>我是加粗标签</strong>
</template>
VUE2.0:必须有根元素,包裹住所有的代码
<template id="aaa">
<div>
<h3>我是组件</h3>
<strong>我是加粗标签</strong>
</div>
</template>
二.关于组件定义
VUE1.0定义组件的方式有:
Vue.extend 这种方式,在2.0里面有,但是有一些改动 Vue.component(组件名称,{ 在2.0继续能用
data(){}
methods:{}
template:
});
VUE2.0定义组件的方式则更为简单
var Home={
template:'' -> 相当于Vue.extend()
};
三.生命周期的变化
vue1.0的生命周期为
init ->初始化
created ->创建
beforeCompile ->编译之前
compiled ->编译完成
ready √ -> mounted
beforeDestroy ->销毁之前
destroyed ->已经销毁
vue2.0的生命周期为(标*的为经常用的)
beforeCreate 组件实例刚刚被创建,属性都没有
created 实例已经创建完成,属性已经绑定
beforeMount 模板编译之前
mounted 模板编译之后,代替之前ready *
beforeUpdate 组件更新之前
updated 组件更新完毕 *
beforeDestroy 组件销毁前
destroyed 组件销毁后
vue1.0和vue2.0的区别(一)的更多相关文章
- vue1.0和vue2.0的区别(二)
这篇我们继续之前的vue1.0和vue2.0的区别(一)继续说 四.循环 学过vue的同学应该知道vue1.0是不能添加重复数据的,否则它会报错,想让它重复添加也不是不可以,不过需要定义别的东西 而v ...
- vue1.0与vue2.0对于v-for的使用的区别
vue1.0与vue2.0对于v-for的使用的区别: 1,vue1.0中有$index,而vue2.0将$index移除. 2,vue1.0中(index,item) in list 而vue2.变 ...
- vue1.0 与 Vue2.0的一些区别 及用法
1.Vue2.0的模板标记外必须使用元素包起来: eg:Vue1.0的写法 <!DOCTYPE html> <html> <head> <meta chars ...
- vue1.0+vue2.0实现选项卡
通常我们写tab选项卡的时候,一般都是用jq等去操作dom,给同级元素移除active类,然后,给被点击元素添加active类,用vue实现也是同样的原理,都是操作active类. 我们都知道用vue ...
- 【重点突破】—— Vue1.0到Vue2.0的变化
前言: 本文参考作者:_So_ 和 我是某慧 的博文,重点梳理Vue1.0升级到Vue2.0后在开发中要注意的不同,以做学习. 组件模板不再支持片段代码,必须有一个顶级元素包裹,例如: ...
- Vue1.x 到Vue2.0的一个变化
小弟初来乍到,写的不好的地方还望指正.谢谢各位! 废话不多说 进入正题: Vue1.x到2.0的一个变化 1. 在每个组件模板,不在支持片段代码 组件中模板: 之前: <templa ...
- 用webpack2.0构建vue2.0超详细精简版
初始化环境 npm init -y 初始化项目 安装各种依赖项 npm install --save vue 安装vue2.0 npm install --save-dev webpack@^2.1. ...
- 用webpack2.0构建vue2.0单文件组件超级详细精简实例
npm init -y 初始化项目 //-y 为自动生成package.json,如果需要自行配置,去掉-y即可 安装各种依赖项 npm install --save vue 安装vue2.0 np ...
- vue使用中遇到的,以及vue1.0到vue2.0新手踩的坑
最近再写一个vue的项目,视频中用的是vue1.0,但是现在vue已经2.0,所以踩了很多坑,先记录下来.理解有误再来修改. 路由问题 之前的路由是写在app.vue里边,而2.0的路由直接有个rou ...
随机推荐
- Itext中 根据html生成Word文件,包含图片
package cn.com.wzf; import java.io.FileOutputStream; import java.io.OutputStream; import java.io.Str ...
- XJOI1564最小距离问题
最小距离问题 我国蒙古大草原上有N(N是不大于100的自然数)个牧民定居点P1(X1,Y1).P2(X2,Y2). -Pn(Xn,Yn),相应地有关权重为Wi,现在要求你在大草原上找一点P(Xp,Yp ...
- 老李秘技:LoadRunner支持参数文件极限是多大
老李秘技:LoadRunner支持参数文件极限是多大 Controller不支持参数文件大于20m
- 老李分享:DBA
poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.如果对课程感兴趣,请大家咨询qq:908821478,咨询电话010-845052 ...
- JSON的数据类型
数据类型简介 在计算机中,我们需要知道正在处理什么类型的数据,因为不同类型的数据有着不同的操作途径.可以让两个阿拉伯数字相乘,但是不能让两个单词相乘. 在计算机科学中,有一种数据类型被称为原始数据类型 ...
- 鼠标滚动:mousewheel事件在Firefox采用DOMMouseScroll事件的统一处理
这是一个小事件,但当下的WEB应用交互非常丰富,判断鼠标的滚动来执行相应的操作是比较常见的.我用Chrome/IE/Firefox/Opera 4种浏览器做测试,发现只有firefox的处理方法有很大 ...
- js 形参和实参---2017-04-11
一.定义 1.实参(argument): 全称为"实际参数"是在调用时传递给函数的参数. 实参可以是常量.变量.表达式.函数等, 无论实参是何种类型的量,在进行函数调用时, ...
- effective c++ Item 48 了解模板元编程
1. TMP是什么? 模板元编程(template metaprogramming TMP)是实现基于模板的C++程序的过程,它能够在编译期执行.你可以想一想:一个模板元程序是用C++实现的并且可以在 ...
- Webdriver API之操作(一)
一. 控制浏览器 1. 控制浏览器大小 driver.set_window_size(480,800) #浏览器宽480,高800显示 dirver.maximize_window() #浏览器最大化 ...
- 安装hadoop2.7.3
hadoop3与hadoop2.x的变化很大,hadoop3很多东西现在做起来太麻烦了,这里先安装hadoop2.7.3 此贴学习地址http://www.yiibai.com/t/mapreduce ...