¿Quiero agregar un nuevo valor clave a la matriz en el estado? Te digo lo que quiero hacer a continuación. ¿Cómo puedo hacer eso? 1. Estado de inicio en el método de constitución
`this.state = { files: [] }'Después de configurar el estado con archivos activos
this.setState({archivos: archivos activos})
Pantalla de mi estado
{ files: [ { key1: val1, key2: val2, key3: val3 }, { key1: val1, key2: val2, key3: val3 }, { key1: val1, key2: val2, key3: val3 } ] }
¿Cómo agregar un nuevo valor clave para cada archivo? El estado que quiero
{ files: [ { key1: val1, key2: val2, key3: val3, key4: val4 }, { key1: val1, key2: val2, key3: val3, key4: val4 }, { key1: val1, key2: val2, key3: val3, key4: val4 } ] }
Creo que esto cumplirá con el escenario anterior.
const newFile = this.state.files.map((file) => { return {...file, key4: val4}; }); this.setState({files: newFile });Puede hacer uso de forEach y agregar el nuevo valor como
var newState = [...this.state.files]; newState.forEach(function(file) { file.key4 = "val4" }) this.setState({files: newState}, function() { console.log(this.state.files); })Violín
class App extends React.Component { constructor() { super(); this.state = { files: [ { key1: "val1", key2: "val2", key3: "val3" }, { key1: "val1", key2: "val2", key3: "val3" }, { key1: "val1", key2: "val2", key3: "val3" } ] } } componentDidMount() { console.log(this.state.files) ; var newState = [...this.state.files]; newState.forEach(function(file) { file.key4 = "val4" }) this.setState({files: newState}, function() { console.log(this.state.files); }) } render() { return <div>Hello</div> } } ReactDOM.render(<App/>, document.getElementById('app')); <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> <div id="app"></div>