vue2.0的变化，与vue1.0对比

Jacksoncz

墨衍会员 · AI 创作全网分发码龄9年

关注

原创最新推荐文章于 2025-06-23 14:21:45 发布 4.3k 阅读 AI 写同款· GEO 优化 ›

1.在每个组建的模板中，不再支持片段代码。

组件中模板：

Vue1.0：

</template>

Vue2.0：必须有一个根元素，包裹所有的元素

<div>

</div>

</template>

2.关于组件的定义

Vue.extend 这种方式，在2.0里面有，但是有一些改动，这种写法虽然可以用，但是尽量少用

Vue.component(组件名称，{ // 在2.0继续能用

data(){}

methods{}

template:

})；

2.0推出一个组件的简洁定义的方式：

var Home={

template:''

};

3.生命周期

Vue1.0:

init

created

beforeCompile

compiled

ready

beforeDestroy

destroyed

Vue2.0：

beforeCreate: 组件实例刚刚被创建，属性都没有

created: 实例已经创建完成，属性已经绑定

beforeMount: 模板编译之前

mounted: 模板编译完成(代替之前的cimpiled和ready两个状态)

beforeUpdate: 组件更新之前

updated: 组件更新完毕

beforeDestroy: 组件销毁前

destroyed: 组件销毁后

4.Vue2.0循环

1.0里面：v-for="val in list"想要添加重复的数据：track-by="$index"

2.0里面：

1）默认可以添加重复的数据

2）去掉了隐式的变量，如$index,$key,在Vue2.0中 v-for="(val,index) in list :index"

在json中，v-for="(val,key) in json"

5.自定义键盘的指令

1.0里面：Vue.direction('on').keyCodes.f1=12;

2.0里面：Vue.config.keyCodes.ctrl=17;

6.过滤器

1.0里面：

系统自带很多过滤器

....

limitBy

filterBy

一些简单的功能，自己通过js实现

2.0里面：

内置过滤器，全部删除了

lodash工具库：_.debounce(fn,200)

自定义过滤器：还存在

但是，自定义过滤器传参，

之前: {{msg | toDou '12' '5'}}

现在: {{msg | toDou('12','5')}}

7.组件通信：

vm.$emit()

vm.$on();

父组件和子组件：

子组件想要拿到父组件的数据：

通过 props:[]

Vue1.0:子组件可以更改父组件的信息，可以使同步的sync

现在：不允许直接给父级的数据，进行赋值操作

满足下面的条件时可以修改：

a).父组件每次传一个对象给子组件,对象之间是引用的最靠谱的方式

b).只是不报错，mounted中转

8.可以使用一个"单一事件"管理组件通信

var Event = new Vue();

Event.$emit(事件名称，数据)

Event.$on(事件名称，function(data){

//data

}.bind(this));

收录于

Web

Vue

UE4-（IK）实现人物脚贴合地面解决斜坡上脚无旋转无法贴合地面问题在斜面上脚陷入模型中，需要设置旋转值对脚的骨骼进行一个旋转。解决思路：在射线检测中可以获取到检测点的法线方向，根据法线方向来计算出脚应该向哪个方向进行适当的旋转，在斜坡上，人物脚需要旋转的轴为x轴和y轴以便来贴合地面，z轴方向的旋转是不需要进行修改的。如图所示，我们需要求得水平面与斜坡的夹角用来得出人物在x轴上的脚旋转量，在蓝图中提供反正切函数，反正切 = 锐角的邻边/对边所以反正切值（脚x轴值（roll）） = 法线Y轴值/法线Z轴值。现在将上图的人物想象成面向屏幕，脚需... 阅读详情

vue2.0的变化，与vue1.0对比

相关推荐