计算属性（Computed Properties）

优质

小牛编辑

132浏览

2023-12-01

计算属性将函数声明为属性，Ember.js在需要时自动调用计算属性，并在一个变量中组合一个或多个属性。

下表列出了计算属性的属性 -

S.No.	属性和描述
1	链接计算属性链接计算属性用于与一个或多个预定义的计算属性聚合。
2	Dynamic Updating 在调用计算属性时动态更新它们。
3	Setting Computed Properties 通过使用setter和getter方法帮助设置计算属性。

例子 (Example)

以下示例将计算属性添加到Ember.object并显示如何显示数据 -

import Ember from 'ember';
export default function() {
   var Car = Ember.Object.extend ({
      //The values for below variables will be supplied by 'create' method
      CarName: null,
      CarModel: null,
      carDetails: Ember.computed('CarName', 'CarModel', function() {
         //returns values to the computed property function 'carDetails'
         return ' Car Name: ' + this.get('CarName') + '<br>' + 
            ' Car Model: ' + this.get('CarModel');
      })
   });
   var mycar = Car.create ({
      //initializing the values of Car variables
      CarName: "Alto",
      CarModel: "800",
   });
   //Displaying the information of the car
   document.write("<h2>Details of the car: <br></h2>");
   document.write(mycar.get('carDetails'));
}

现在打开app.js文件并在文件顶部添加以下行 -

import computedproperties from './computedproperties';

其中， computedproperties是指定为“computedproperties.js”并在“app”文件夹下创建的文件的名称。现在，在导出之前调用底部的继承“computedproperties”。它执行在computedproperties.js文件中创建的computedproperties函数 -

computedproperties();

输出 (Output)

运行ember服务器，您将收到以下输出 -