vue3 computed

前言:

import {computed} from 'vue'

let aa = computed(() => {})    //传回调函数
let aa = computed({})    //传对象

返回的类似一个ref包装的响应式对象,如果值是基本数据类型,需要.value进行拆箱

一、常规使用

const aa = computed(() => {
    return msg.value + 's'
})

二、传参使用(回调函数中返回一个函数定义fn,参数作为fn的参数传入)

const aa = computed(() => {
    return (num) => {
        return msg.value + num
    }
})

三、get和set

场景:v-model="aa"

const aa = computed({
    get() {
        return msg.value + 's'
    },
    set(n) {
        // set函数体中处理相关联的响应数据,可以是data、vuex的状态、props等
        // 而并非直接给计算属性设置
        // 无需返回任何东西
        msg.value += n
    }
})

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