Vue3学习笔记 - Composition API(二)

1 computed函数使用(重要)

computed

前面我们了解到计算属性computed:当我们的某些属性是依赖其他状态时 可以使用计算属性处理

在前面的Options API中 我们是使用computed选项来完成的

在Composition API中 我们可以在setup函数中使用computed方法来编写一个计算属性;

如何使用computed?

方式一: 接收一个getter函数 并为getter函数返回值 返回一个不变的ref对象

方式二: 接收一个具有get 和 set的对象 返回一个可变的(可读写的)ref对象

c965onst fullName = computed(()=>{
  return names.firstName + " " + names.lastName
})

setup中使用ref

在setup中如何使用ref获取元素或者组件?

我们只需要定义一个ref对象,绑定到元素或组件的ref属性上即可;

2 组件的生命周期函数(重要)

生命周期钩子

前面说过setup可以替代data methods …这些选项 也可以替代 生命周期钩子(函数)

那么setup中如何使用生命周期函数呢?

可以使用直接导入的onXX函数注册生命周期钩子

3 Provide/Inject使用(了解)

Provide函数

在Composition API 也可以替代之前的Provide和Inject的选项

我们可以通过provide来提供数据:

通过provide方法来定义每个Property