預期效果:單擊按鈕 -> 調用函數save-> 將對象傳遞p給函數update更新{a: 'purple', desc: 'grt', date: '12 -10-2019 '}顏色數組中的第二個對象,它在products數組中更新前: {a: 'purple', desc: 'grt', date: '12 -10-2019 '}更新后: {a: 'violet', desc: 'gt', date: '12 -12-1980 '}console.log 中的錯誤:Uncaught TypeError: this.props.product.colors.map is not a function應用程序class App extends Component { constructor (props) { super(props); this.state = { products: [ { colors: [{a:'orange', desc: 'grtrt', date: '02-12-2019'}, {a:'purple', desc: 'grt', date: '12-10-2019'}] desc: 'gfgfg', }, { colors: [{a:'black', desc: 'g', date: '12-12-2019'}, {a: 'white', {a:'black', desc: 'grtrt', date: '12-12-2119'}, }, {a:'gray', desc:'', date: '01-01-2000'}], desc: 'gfgfgfg', } ], selectProductIndex: 0 //It is first object in products array index: 1 //It is second object in colors array } } update = (item) => { const {selectProductIndex} = this.state; this.setState(prevState => { return { products: [ ...prevState.products.slice(0, selectProductIndex), Object.assign({}, prevState.products[selectProductIndex], {colors: item}), ...prevState.products.slice(selectProductIndex + 1) ] }; }); } render () { return ( <div> <Items product={this.state.products[this.state.selectProductIndex]} update = {this.update} /> </div> ) }
在 React 中更新嵌套數組中的嵌套對象
LEATH
2021-06-30 13:04:59