vue2和vue3的区别
一、# 模板指令
1、v-if、v-for的区别
3.0不建议写在一个元素上,但是依然可以同时绑定
vue2:当在同一个元素上使用v-if时,将优先v-for
2、v-model对的组件使用进行了返工,替换v-bind.sync
4、v3提供2中定义组件的方式
defineComponent
defineAsyncComponent 异步组件 用法就是在2.0的基础上 用这个函数处理之后的返回值
5、生命周期函数 :
生命destroyed周期选项已重命名为unmounted
生命beforeDestroy周期选项已重命名为beforeUnmount
Vue2.0的beforeCreate、created在Vue3.0中被setup()代替 :
开始创建组件之前,在beforeCreate和created之前执行。创建的是data和method
二、api
vue2
props: {
title: String
},
data () {
return {
username: '',
password: ''
}
},
methods: {
login () {
// 登陆方法
}
},
components:{
"buttonComponent":btnComponent
},
computed:{
fullName(){
return this.firstName+" "+this.lastName;
}
}
}
vue3
props: {
title: String
},
setup () {
const state = reactive({ //数据
username: '',
password: '',
lowerCaseUsername: computed(() => state.username.toLowerCase()) //计算属性
})
//方法
const login = () => {
// 登陆方法
}
return {
login,
state
}
}
}
6、不能在事件修饰符中绑定键码值keycode了,这个API已经被移除, 现在使用标准的key
7、off 和 $once 实例方法用不了,意味着中央事件总线bus被弃用
8、Vue2过滤器也被弃用
9、app.componet注册全局组件
10、全局配置不再绑定到原型 globalPrexxxx