Блог

Когда я пытаюсь включить кнопку удаления, это не работает, хотя я ввел логику для этого .. На самом деле, после ввода следующего, кнопка удаления всегда включена. Не удается найти проблему. Вот код:

Sports.js

 // initiallising states
const [items1, setItems1] = useState({
pageCount: '',
field_names_state: [],
toggle: false,
elements: [],
data_form: [],
sports_id: '',
buttonDisable: "0",
}); 


const onRadioChange = (e) => {
items1.sports_id = e.target.value;
items1.buttonDisable="1";
alert(items1.buttonDisable);
};

// mapping our fetched data and send them to Table_Sports.js

const data1 = items1.elements.map((item) => (
<Table_Sports key={item.sports_id} item={item} action={onRadioChange} />
));

<button type='button' disabled={items1.buttonDisable=="1"} onClick={(e) => handleDelete(e)}>
    Delete
</button>
  

Table_Sports.js

   <td>
    <input
      type='radio'
      // defaultValue={props.item.sports_id}
      defaultValue={props.}
      name='sports_id'
      onClick={(e) => props.action(e)}
    />
  </td>

  <td>
    <input
      type='text'
      defaultValue={props.item.sports_name}
      name='sports_name'
      contentEditable='true'
    />
  </td>
  

Чтобы изменить значение в состоянии, вы должны вызвать setItems1, передав новый объект состояния в качестве параметра вместо того, чтобы напрямую манипулировать его свойствами. Если вы измените свою функцию onRadioChange таким образом, она должна работать:

 const onRadioChange = (e) => {
    setItems1({
        ...items1,
        sports_id: e.target.value,
        buttonDisable: "1",
    });
};