【发布时间】:2016-09-17 00:40:18
【问题描述】:
我正在设置按钮点击状态。
即 this.setState('array', array);
在第一个 setState 上它会影响前端。但是当我将更多值推送到数组并尝试再次设置状态时,不会影响状态和前端。
有没有办法一遍又一遍地设置状态并再次渲染页面。
【问题讨论】:
标签: javascript node.js marko
我正在设置按钮点击状态。
即 this.setState('array', array);
在第一个 setState 上它会影响前端。但是当我将更多值推送到数组并尝试再次设置状态时,不会影响状态和前端。
有没有办法一遍又一遍地设置状态并再次渲染页面。
【问题讨论】:
标签: javascript node.js marko
Marko Widgets 只是在新状态和旧状态之间进行浅层比较,以确定是否需要重新渲染 UI 组件。也就是说,Marko Widgets不会对数组进行深度比较,以确定新数组是否有新元素或不同元素。出于性能原因进行了浅层比较,因为对于作为 UI 组件状态一部分的每个属性进行深度比较通常计算量太大。
解决方案 1
推荐的策略是将添加到状态的对象视为不可变的。也就是说,您不会改变旧数组,而是使用附加元素创建一个新数组:
不好:
var myArray = this.state.myArray;
myArray.push('foo');
this.setState('myArray', myArray); // No change since myArray === this.state.myArray
好:
var myArray = this.state.myArray;
myArray = myArray.concat('foo'); // myArray !== this.state.myArray
this.setState('myArray', myArray);
解决方案 2
另一种选择是在改变数组后调用this.setStateDirty('myArray'):
var myArray = this.state.myArray;
myArray.push('foo');
this.setStateDirty('myArray'); // Mark the object as being modified
更多信息:
【讨论】: