1，computed属性
在 Vue.js 中，
computed
属性是 Vue 响应式系统的一个核心特性，它允许开发者声明式地描述一个依赖其他响应式属性的计算值。
computed
属性是基于它们的依赖进行缓存的，只有当依赖发生变化时，它们才会重新计算。这种机制极大地提高了性能，尤其是在处理复杂数据结构或频繁计算时。
computed
属性特点：
响应式：当依赖的数据发生变化时，computed 属性会自动重新计算。
缓存：
computed属性会缓存计算结果，只有当依赖的数据发生变化时，才会重新计算。
惰性求值：
computed属性在首次访问时才会进行计算，之后会根据依赖数据的变化情况决定是否重新计算。
注意：
1，computed 的属性应该是只读的， 一旦在模板中使用了计算属性，就不应该在组件中修改它的值。如果需要修改，可以将其转换为一个方法。2， computed 可以返回一个函数。这在需要在模板中使用函数式编程时很有用。例如，你可以使用 v-for 指令来循环执行一个函数，并返回一组结果。3， computed 不需要加小括号。 computed可以向普通属性一样，直接使用，不需要额外加小括号调用。4， computed惰性求值，即计算的值不渲染使用的话，是不会计算的。这个使用可以括在模版中使用，或者在函数中被使用。
2，computed例子解析
例子：
var vm = new Vue({
data: {
firstName: 'John',
lastName: 'Doe'
},
computed: {
fullName: function () {
return this.firstName + ' ' + this.lastName;
}
}
});
fullName
是一个
computed
属性，它不需要再被data中定义，可以直接使用this.fullName在函数中使用，或者直接使用
fullName
在模版中渲染。
fullName
的计算结果会被缓存起来，
它依赖于
firstName
和
lastName
。
只要计算属性所依赖的属性发生变化，计算属性就会重新执行，视图也会更新。即
当
firstName
或
lastName
变化时，
fullName
会自动重新计算。
另外，因为惰性计算原理，如果
fullName
没有被使用，是不会被计算的。
3，我的使用：
我的代码中是这样使用的：
data:function(){
return{
form:{
name:"",
table_name:"",
idc:"",
}
}
},
computed:{
from_name() {
console.log("计算form_name")
var formname=this.form.table_name + '启动机房：' + this.form.idc
this.$set(this.form,'name',formname)
return formname;
}
},
定义了
computed属性from_name，依赖data模块中定义的form对象，form对象的table_name属性和idc属性。计算后赋值给form.name属性。实现了统计table_name和idc属性来计算得到name属性的目的。
我的使用位置是在模版中展示名称from_name
<el-form-item label="计划名称">
<el-input v-model="from_name" :disabled="true"></el-input>
</el-form-item>虽然 from_name属性的值并不是我们的最终目的，但是form_name必须得到使用才能完成整个计算得到form.name，否则依据惰性计算原理，form.name不会得到结果。
![复健第二天之[MoeCTF 2022]baby_file](https://i-blog.csdnimg.cn/direct/4dc2f4edbab54ac19f92a86a37c19c2f.png)
