5

最近コードに導入した非推奨を排除しようとしていますが、助けが必要です。

非推奨は次のとおりです。

1 回のレンダリングで ... を 2 回変更しました。これは Ember 1.x では信頼性が低く、Ember 2.0 で削除される予定です [非推奨 ID: ember-views.render-double-modify]

私がやろうとしているのは、スコアのリストとスコアの合計を表示することです。最低スコアを削除し、計算された合計に含めないようにする必要があります。私はこれを機能させています。除外されたスコアに classNameBindings を介して CSS クラスを追加しようとすると、非推奨になります。

計算されたTotalのプロパティでEmber.setを実行しているときに、これが起こっていると確信しています。

私の質問は、フォームのスコアを変更したときに、CSS も更新された状態で合計スコアを更新し続けるにはどうすればよいですか?

コードの詳細: 2 つのコンポーネントがあります。スコア行とジャッジ行。スコア行は、スコア オブジェクトの配列を受け取り、各スコアをループして、ジャッジ スコア コンポーネントを呼び出します。

Ember      : 2.2.0
Ember Data : 2.2.1

更新ここでは、問題を示す作業中の Ember Twiddle を示します。

https://ember-twiddle.com/6696d907b604aa750201?numColumns=1

index.js - (この質問のために引き出された模擬コード) 

let scores = new Ember A();
scores.pushObject(Ember.Object.create({ points: 1 }));
scores.pushObject(Ember.Object.create({ points: 2 }));
scores.pushObject(Ember.Object.create({ points: 3 }));

index.hbs

{{score-row scores=scores}}

スコア行.hbs

{{#each scores as |score|}}
    {{judge-score score=score}}
{{/each}}

{{calculatedTotal}}

スコア行.js: 

calculatedTotal: Ember.computed('scores.@each.points', () => {
    let totalScore = 0,
        scores = this.get('scores');

    if(Ember.isPresent(scores)) {
        var i,
            scoresLength = scores.length,
            sortedAscending,
            numLowToDrop = 1;

        sortedAscending = this.get('sortedScores');

        for(i = 0; i < scoresLength; i++) {
            currentScoreObj = sortedAscending.objectAt(i);

            // I think this is what is causing the ember-views.render-double-modify
            Ember.set(currentScoreObj, '_droppedLow', (i < numLowToDrop));
        }

        sortedAscending.forEach((score) => {
            if( !score.get('_droppedLow') ) {
                totalScore += +score.get('points');
            }
        });
    }
    return totalScore;
}),

// had to write my own sort because scores.sortBy('points') was sorting as if 
// points were a string and not a number ?
sortedScores: Ember.computed.sort('scores.@each.points', (score1, score2) => {
    if (+score1.get('points') > +score2.get('points')) {
        return 1;
    } else if (+score1.get('points') < +score2.get('points')) {
        return -1;
    }
    return 0;
})

ジャッジスコア.hbs

{{input value=score.points}}

ジャッジスコア.js 

import Ember from 'ember';

export default Ember.Component.extend({
    classNameBindings: [
        "score._droppedLow:droppedLow"
    ]
});

ありがとう！

4

1 に答える 1

0

呼び出されるたびにpushObject、計算されたプロパティが再トリガーされるのではないでしょうか?

これを試して：

let scores = new Ember A([
  Ember.Object.create({ points: 1 }),
  Ember.Object.create({ points: 1 })
]);
于 2015-12-17T17:36:33.317 に答える