id, text: e.target.value})) }} placeholder={ material.materialName + ' ' + material.id }/>
имею ввиду ({id: id, text: e.target.value}) в onChange
и да, делают и нет, может быть больно стейт формы в редакс (если это он) - может быть больно и иногда тормозить про initialState - выглядит как есть 5 инстансов компонента (FormGroup какой-то) которые изменяются и что-то их соединяющее т.е. если не искать доп инструмент и делать проще - я тут вижу компонент аля MaterialData({data, onChange }) который отрисовывает Data: {materialName: string, date: string, quantity: number, reason: number} и при изменении полей делает onChange с новой Data а уже парент аггрегирует все дочерние MaterialData
const MaterialRow = (props) => { const dispatch = useDispatch(); const { materialName, id, quantity, reason, date, count } = props.data; return ( <div key={ id } className="tr material"> <span className="td">{ props.num }</span> <MaterialNameCell id={ id } data={ materialName }/> <MaterialQuantCell data={ quantity }/> <ReasonChoiseCell data={ reason }/> <MaterialDateCell data={ date }/> <a href="#!" id={ id } className="material-remove-btn" title="Удалить материал" onClick={ () => dispatch( removeMaterial( id ) ) }></a> </div> ); } const MaterialList = (props) => { const dispatch = useDispatch(); const materials = useSelector( state => state.materials.materials ); let count = 1; const materialRows = materials.map( data => <MaterialRow num={ count++ } data={ data } /> ); return( <div className="request-tbody"> { materialRows } </div> ); }
я предлагал, чтобы MaterialRow делал onChage при изменении данных внутри, а уже MaterialList эти данные как-то собирал вместе а тут каждая ячейка внтури MaterialRow делает dispatch
Обсуждают сегодня