Vue3的组合式API介绍,和Vue2生命周期函数的变化

目录

  • 1,setup
  • 2,生命周期函数
    • 1,为什么删除了 beforeCreate 和 created?
    • 2,新增钩子函数
  • 3,compositionAPI 相比于 optionAPI 有哪些优势?

Vue3 中新增了 composition API(组合式API),包括

  • 响应式API
  • setup()
  • 生命周期函数

setup() 和生命周期函数都是和组件深度绑定的,不能脱离组件单独存在。

1,setup

官网参考

  1. setup() 是在组件中使用组合式API的入口。该函数在组件属性 props 被赋值后立即执行,早于所有生命周期函数
<script>
export default {
  setup(props, context){
    // props 是一个对象,包含了所有的组件属性值
    // context 是一个对象,提供了组件所需的上下文信息
  }
}
script>

context对象的成员

成员 类型 说明
attrs 对象 vue2this.$attrs
slots 对象 vue2this.$slots
emit 方法 vue2this.$emit
expose 方法 新。暴露公共属性

另外,在 setup() 函数中返回的对象会暴露给模板和组件实例。如果使用的

你可能感兴趣的:(vue3,vue.js,前端,javascript,vue3)