從陣營狀態集合

無法刪除的項目我有我的陣營組件定義這兩個方法：從陣營狀態集合

handleAddMetric() { 
    const metricKey = prompt('Name/key of metric'); 
    const newMetricItem = { 
     name: metricKey, 
     value: 100 
    } 
    let newMetrics = {}; 
    newMetrics[metricKey] = newMetricItem; 
    const updatedMetrics = Object.assign({}, this.state.metrics, newMetrics); 
    this.setState({ metrics: updatedMetrics }); 
} 

handleRemoveMetric(keyName) { 
    let updatedMetrics = this.state.metrics; 
    delete updatedMetrics[keyName]; 
    console.log('handleRemoveMetric', this, keyName, updatedMetrics); 
    this.setState({ metrics: updatedMetrics }); 
}

添加新的值this.state.metrics工作正常，但刪除：

<button onClick={this.handleRemoveMetric.bind(this, key)}>Delete</button>

。 ..calls我的handleRemoveMetric功能，但不會更新收藏。

我首先是與this有些問題，但似乎並非如此。

任何想法？

更新：控制檯輸出爲：

handleRemoveMetric Metrics {props: Object, context: Object, refs: Object, updater: Object, state: Object…}componentWillUnmount: function()context: Objectprops: Objectref: Objectrefs: ObjectsetState: function (data, cb)state: Objectupdater: Object_reactInternalInstance: ReactCompositeComponentWrapperisMounted: (...)replaceState: (...)__proto__: ReactComponent 
"myMetricKey" 
Object {MRR: Object, moneyInBank: Object, wow: Object}

...所以至少收集在本地更新。

來源

2017-06-04 Tom Söderlund

keyName是否正確？和'console.log（'handleRemoveMetric'，keyName，updatedMetrics）的結果;'包含已刪除的鍵？ –

@MayankShukla好點。我包含了上面的控制檯輸出。它看起來好像集合在本地更新，但不在'state'中。 –

您需要將其複製到新的對象。 'const metrics = {... this.state.metrics，[keyName]：undefined}; this.setState（{metrics}）;'應該工作。 – vijayst

您需要將它複製到一個新的對象。

const metrics = { 
    ...this.state.metrics, 
    [keyName]: null 
}; 
this.setState({ metrics });

應該工作。

來源

2017-06-04 13:47:43 vijayst

從陣營狀態集合

回答

相關問題