Блог

Главная - Вопросы по программированию - встроенное редактирование в react.js не удалось открыть ни одного элемента

встроенное редактирование в react.js не удалось открыть ни одного элемента

#javascript #reactjs

#javascript #reactjs

Вопрос:

Когда я нажимаю на редактирование, я ожидаю, что будет затронута только 1 строка. Однако были затронуты все строки, что я сделал не так?

 ..
renderItem(){
     return(
       this.state.items.map((item,i)=>
         <li key={i}> {this.state.isEdit ? this.renderEditForm() : item} {this.ItemCtrl(i)}</li>)
     )
   }
..

http://jsfiddle.net/nkum8mep

Ответ №1:

каждая строка прослушивает одно и то же состояние IsEdit, поэтому, когда вы измените IsEdit на true, все они будут обновлены до редактирования, поскольку все они имеют одно и то же свойство. если вы хотите, вы можете создать объект [{item: 1, editing: false}], например, и установить состояние редактирования для определенного выбранного индекса.

Комментарии:

1. хм, но говорит, что у меня есть элементы, поступающие из серверной части, я должен ввести дополнительное свойство IsEdit, равное false во время инициализации? это странно.

2. @Sandy Вы также могли бы сделать что-то вроде этого jsfiddle.net/v3hrLcsk где вы устанавливаете IsEdit в качестве индекса редактируемого элемента

3. Извините, забыл его обновить. Вот и все jsfiddle.net/v3hrLcsk/1

4. отлично, просто минимальное изменение

5. еще одна проблема, лучше скрыть кнопки управления: редактировать и удалять, когда пользователь редактирует.