vue3 computed计算属性

        我们在使用模版语法时有时会使用三位运算符去处理一些简单的逻辑，当一个变量的值依赖了其它变量，并进行了一些逻辑上的处理时，我们可以使用computed计算属性去处理。

        一个小栗子,使用计算属性判断一本书是否被出版，代码如下：

<template>
  <h2>Computed计算属性的使用</h2>
  <div class="box">
    <div>
      <div>图书{
  { bookName }}{
  { isPublic }}</div>
    </div>
  </div>
</template>
<script setup lang="ts">
import { ref, computed } from "vue";

// 计算属性的使用
const bookName = "Happy Book";
const isPublic = computed(() => {
  return bookName.length > 0 ? "已出版" : "未出版"
});
</script>

        计算属性的值与其它属性有计算关系时，使用计算属性可以把独立的计算逻辑代码块包装到函数里

        一个小栗子，两个字符串常量组成一本被出版的书名，书名我们使用计算属性，代码如下：