computed中get和set方法
getter
getter方法,用于返回当前computed属性的属性值
一般使用普通函数来作为回调函数
computed: { site: { // getter get: function () { console.log(this); // VueComponent {_uid: 4, _isVue: true, $options: {…}, _renderProxy: Proxy, _self: VueComponent, …} return; } } }
如果使用箭头函数,会改变this指向,因为计算属性得到的结果一般都是通过对一些其他数据进行操作后得到的结果,所以如果改变this指向,在取值时会有很大麻烦
computed: { site: { // getter get: () => { console.log(this); // undefined return; } } }
setter
setter方法,用于对计算属性所得到的结果进行操作,计算属性默认只有getter,不过在需要时你也可以提供一个setter
setter方法的回调函数,我们也选择用普通函数(理由同上)
setter方法的回调函数中会返回一个参数,是我们getter方法得出的结果
computed: { site: { // getter get: function () { return "Google" + "=" + "http://www.google.com"; }, // setter set: function (newValue) { // newValue === "Google=http://www.google.com" }, }, },
这样我们就可以使用新的结果进行后续的操作
【推荐】100%开源!大型工业跨平台软件C++源码提供,建模,组态!
【推荐】AI 的力量,开发者的翅膀:欢迎使用 AI 原生开发工具 TRAE
【推荐】2025 HarmonyOS 鸿蒙创新赛正式启动,百万大奖等你挑战