<template><div id="app"><h1>用户信息</h1><p>全名：{{ fullName }}</p><input v-model="fullName" placeholder="请输入全名" /><p>姓：{{ firstName }}</p><p>名字：{{ lastName }}</p></div>
</template><script>
export default {data() {return {firstName: "John", // 名字lastName: "Doe", // 姓氏};},computed: {// 计算属性 fullName，有 get 和 setfullName: {// get：用来获取 fullName，返回的是 firstName 和 lastName 拼接后的值get() {return this.firstName + " " + this.lastName;},// set：用来设置 fullName，当全名被修改时，分割新的值并更新 firstName 和 lastNameset(newFullName) {const names = newFullName.split(" ");this.firstName = names[0]; // 更新 firstNamethis.lastName = names[1] || ""; // 更新 lastName（如果没有姓氏部分，设置为空字符串）},},},
};
</script><style>
h1 {font-size: 20px;
}
input {margin-top: 10px;
}
</style>

简单来说 返回值写get里面，set里面写数据操作