Хотите установить значение для ключа массива в состоянии реакции
В приведенном ниже коде у меня есть состояние внутри массива emplist с некоторыми ключами, и с помощью события onchange() я хочу установить значение для ключей массива emplist. Как я могу установить эти значения, пожалуйста, помогите мне :).
import React from 'react';
export default class Registrations extends React.Component{
constructor(props){
super(props);
this.state = {
EmployeeList:[
{ EmployeeId : '' },
{ EmployeeName :'' },
{ EmployeeSalary :'' },
{ EmployeeAddress : '' },
{ EmployeeDetails :false },
],
};
}
handleChangeEvent = (e) =>{
// some code actions//
}
render(){
var {EmployeeId,EmployeeName,EmployeeSalary,EmployeeAddress} = this.state;
return(
<div>
<form>
<input type = "text" placeholder = "Enter EmployeeId" onChange = {this.handleChangeEvent}
value = {EmployeeId} name='EmployeeId'/><br />
<input type = "text" placeholder = "Enter EmployeeName" onChange = {this.handleChangeEvent}
value = {EmployeeName} name='EmployeeName'/><br />
<input type = "text" placeholder = "Enter EmployeeSalary" onChange=
{this.handleChangeEvent} value = {EmployeeSalary} name='EmployeeSalary'/><br />
<input type = "text" placeholder = "Enter EmployeeAddress" onChange=
{this.handleChangeEvent} value = {EmployeeAddress} name='EmployeeAddress'/><br />
<button onClick = {this.handleSubmit}>Submit</button>
</form>
</div>
);
}
}
Почему вы моделируете EmployeeList как массив объектов с одним свойством каждый? Не лучше ли было бы, чтобы EmployeeList был объектом со свойствами?
Структура данных вашего состояния не имеет смысла, это должен быть просто один объект, а не массив из 5 объектов. Затем, чтобы обновить одно из этих свойств, onChange просто нужно передать ключ для изменения и значение, на которое его нужно изменить.
@ Толле ... Я не понял твоего вопроса. Я новичок в реакции.
@Nick.... в массиве EmployeeList я хочу установить значения с помощью события onChange(). мой код.....handleChangeEvent = (e) =>{ let x = [...this.state.EmployeeList]; x[e.target.name] = e.target.value; это.setState({x}); }
Ответы 1
Можете ли вы объяснить больше о том, что вы хотите сделать.
В приведенном выше коде вы вводите данные для каждой части данных внутри одного объекта сотрудника, поэтому ваше состояние должно иметь следующую форму:
this.state = {
Employee: {
EmployeeId: '',
EmployeeName: '',
EmployeeSalary: '',
EmployeeAddress: '',
EmployeeDetails: false
}
};
handleChangeEvent = (e) => {
this.setState({
Employee: {...this.state.Employee, [e.target.name]: e.target.value }
})
};
render() {
var {
EmployeeId,
EmployeeName,
EmployeeSalary,
EmployeeAddress,
} = this.state.Employee; // change the destructuring as well
}
Спасибо. теперь с событием onChange() мы должны установить значения для идентификатора сотрудника, имени сотрудника и т. д.
Можете ли вы дать мне код события onchange (), пожалуйста.
Можете ли вы перефразировать то, что вы ищете? Из вашего описания пока ничего не ясно. Кроме того, предоставьте любой код, который вы пробовали до сих пор.