vue3 computed 用法

最新推荐文章于 2024-10-14 14:43:08 发布

一头小绵羊

最新推荐文章于 2024-10-14 14:43:08 发布

阅读量940

点赞数 2

分类专栏：前端文章标签： Vue reactive computed 计算属性状态管理

本文链接：https://blog.csdn.net/rojie0/article/details/125796587

版权

前端专栏收录该内容

46 篇文章 1 订阅

订阅专栏

<script setup>
    import {
      reactive,
      computed,
    } from 'vue'

    //数据
    let person = reactive({
       firstName:'小',
       lastName:'叮当'
     })
    // 计算属性简写
    person.fullName = computed(()=>{
        return person.firstName + '-' + person.lastName
      }) 
    // 完整写法
    person.fullName = computed({
      get(){
        return person.firstName + '-' + person.lastName
      },
      set(value){
        const nameArr = value.split('-')
        person.firstName = nameArr[0]
        person.lastName = nameArr[1]
      }
    })
</script>