20231114歌谣v3--学习篇-计算属性

最新推荐文章于 2024-09-14 21:53:48 发布

前端歌谣

最新推荐文章于 2024-09-14 21:53:48 发布

阅读量342

点赞数 8

文章标签：学习 javascript 开发语言

本文链接：https://blog.csdn.net/qq_41632427/article/details/134395305

版权

前端学习-2023 专栏收录该内容

4420 篇文章 3 订阅

订阅专栏

这篇文章介绍了在Vue.js中如何使用`ref`和`computed`特性，特别是展示了如何定义getter和setter方法来操作`firstName`和`lastName`的值，以及使用解构赋值进行数据更新。

摘要由CSDN通过智能技术生成

// 组件中
function calculateBooksMessage() {
  return author.books.length > 0 ? 'Yes' : 'No'
}

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

const firstName = ref('John')
const lastName = ref('Doe')

const fullName = computed({
  // getter
  get() {
    return firstName.value + ' ' + lastName.value
  },
  // setter
  set(newValue) {
    // 注意：我们这里使用的是解构赋值语法
    [firstName.value, lastName.value] = newValue.split(' ')
  }
})
</script>