klucz Dynamiczny pomocnik w niezmienność aktualizacji dla tablicy

Question

https://facebook.github.io/react/docs/update.html

Mam funkcji aktualizacji, która odbiera indeks wraz ze zdarzeniem, tak aby zmienić wartość dla tego konkretnego elementu w tablicy.

Jak uzyskać ocenę index zamiast traktować ją jako klucz zestawu w tym scenariuszu? Czy to możliwe?

updateValue: function(index, e) { 
    var items = React.addons.update(this.state.items, { 
    index: { 
    amount: {$set: e.target.value} 
    } 
    }); 
    this.setState({ 
    items: items 
    }) 
} 

Teraz to oczywiście nie działa, ponieważ jest próbą zaktualizowania this.state.items['index']['amount'] który nie jest ustawiony, gdy chcę, aby zmodyfikować this.state.items[1]['amount'] dla indeksu 1.

Answer 1

można użyć ES6 computed property names, które wyglądają jak to z index zmiennej:

updateValue(index, e) { 
    var items = React.addons.update(this.state.items, { 
    [index]: { 
     amount: {$set: e.target.value} 
    } 
    }) 
    this.setState({items}) 
} 

Według tego ES6 compatability table, reagują na JSX transpiler wspiera ich, gdy są włączone jego transformacje harmonia, czy można użyć Babel zamiast tego (od react-tools is being deprecated in favour of Babel).

W przeciwnym razie, można użyć funkcji pomocnika, aby utworzyć obiekt o danej nazwie nieruchomości:

function makeProp(prop, value) { 
    var obj = {} 
    obj[prop] = value 
    return obj 
} 

// ... 

updateValue: function(index, e) { 
    var items = React.addons.update(this.state.items, makeProp(
    index, { 
     amount: {$set: e.target.value} 
    } 
)) 
    this.setState({items: items}) 
}