Vue 3 中为计算属性设置自定义 setter，需用对象语法声明 computed 并显式提供 get 和 set 函数；get 返回读取值，set 接收新值并更新底层响应式数据，不可在 set 中赋值自身以避免循环。
Vue 3 中为计算属性设置自定义 setter，核心是用 对象语法声明 computed，并显式提供 get 和 set 函数；它不是给计算属性“赋值”，而是拦截赋值行为，转而更新底层响应式数据。
必须用对象形式声明 get 和 set
不能只写函数式写法（如 fullName() { ... }），那默认只有 getter。要启用 setter，必须写成键值对对象：
computed: { propName: { get() { ... }, set(newValue) { ... } } }-
get必须返回一个值，决定读取时显示什么 -
set接收一个参数（即外部传入的新值），在里面处理逻辑、更新源数据 - 两者缺一不可，否则会报错或静默失效
在 setup() 中正确使用 ref + computed({ get, set })
组合式 API 下，computed 返回的是一个 ref 对象，读写都需通过 .value：
Springboot Vue Builder
下载
从零开始编排 SpringBoot+Vue 全栈项目工作流，适用于新建全栈项目或完整脚手架请求，触发后依次调用 product‑spec‑builder（需求调研）等模块。
- 声明：
const fullName = computed({ get() { return firstName.value + ' ' + lastName.value }, set(val) { const [first, last] = val.split(' '); firstName.value = first || ''; lastName.value = last || ''; } }); - 模板中可直接用于
v-model="fullName"，输入触发 set，读取触发 get - 脚本中读取写法：
console.log(fullName.value)；赋值写法：fullName.value = '王五'
setter 里不能直接改计算属性自身
这是常见错误：在 set 函数里又给当前 computed 赋值，会导致无限循环。
立即学习“前端免费学习笔记（深入）”；
- ❌ 错误：
set(newVal) { this.fullName = newVal; }（this 指向不对，且语义错误） - ❌ 更危险：
set(newVal) { fullName.value = newVal; }（递归调用自身 set） - ✅ 正确：只操作它所依赖的原始响应式变量，比如
firstName.value、product.value.basePrice等
适合 setter 的典型场景
不是所有计算属性都需要 setter，它适用于需要“反向推导”或“格式转换控制”的场合：
- 表单封装：把多个字段聚合为一个 v-model 接口（如全名 ↔ 姓+名）
- 数值联动：售价 = 基础价 × (1 − 折扣)，修改售价时反推基础价或折扣率
- 格式化输入：用户输入 ISO 时间字符串，setter 自动解析并更新 year/month/day 响应式字段
- 权限映射：将 role 字符串映射为 hasAdmin / hasEditor 布尔值，setter 控制角色变更逻辑
