javascript - 如何为数组属性内的每个元素迭代设置值？

我想将模型中的所有isSelected属性重置为false（请参见下面的模型）

import Ember from 'ember';

export default Ember.Route.extend({
    model() {
        return [
            {
                src: 'assets/images/sample-image0.jpg',
                isInspected: false,
                isSelected: true
            },
            {
                src: 'assets/images/sample-image0.jpg',
                isInspected: true,
                isSelected: false
            }
        ];
    }
});

组件side-bar，

{{app/side-bar
    images=model
}}

在组件内部，我尝试重置下面的模型数组使用代码中每个对象的选定状态（这是设置值的最佳做法吗？）

import Ember from 'ember';

export default Ember.Component.extend({
    classNames: ['side-bar'],

    actions: {
        imageClicked() {
            this._resetSelectionHighlight();
        }
    },

    _resetSelectionHighlight() {
        const images = this.get('images');

        images.forEach((img) => {
            Ember.set(img, 'isSelected', false);
        });

        console.log(this.get('images'));
    }
});

我的问题

在Ember中迭代设置值的正确方法是什么？

最佳答案

您的方法非常好。

但是，Ember已经在您可以使用的setEach类上定义了方法MutableEnumerable。

import Ember from 'ember';

export default Ember.Component.extend({
    // ...

    _resetSelectionHighlight() {
        this.get('images').setEach('isSelected', false); // Note: images must inherit Ember.MutableEnumerable
    }
});

适用于任何阵列的另一种更通用的方法是创建一个帮助程序来帮助您。

// utils/set-array-prop.js
export default function setArrayProp(arr, prop, value) {
  arr.forEach((item) => Ember.set(item, prop, value));
}

然后，您可以在代码中使用它，例如：

import Ember from 'ember';
import setArrayProp from 'my-app/utils/set-array-prop';

export default Ember.Component.extend({
    // ...

    _resetSelectionHighlight() {
        setArrayProp(
          this.get('images'), // now images can be a regular array of objects
          'isSelected',
          false
        );
    }
});