Лучший способ динамически добавлять реагирующие компоненты к одному <div>

0

У меня есть функция автозапуска jQuery, которая позволяет вам искать, выбирать и добавлять свой выбор в <div id="suggested-peers"/>, где вы можете видеть все выбранные вами варианты таким образом до сих пор.

  select: function(event, ui) {
    var newMember = ReactDOM.render(<MemberThumbnail name={ui.item.value.full_name} title={ui.item.value.title} />, document.getElementById("suggested-peers") );

Проблема в том, что каждый раз, когда я делаю новый выбор, старый заменяется. Я подумал о нескольких способах сделать это, но мне любопытно, какой лучший способ достижения этого в Реакт-стиле.

  • 0
    Вы можете показать весь компонент?
Теги:
jsx

1 ответ

1
Лучший ответ

Здесь не так много информации, но в основном что-то вроде:

// Render method of the component that you have ReactDOM.render()ed into
// your document.
function render () {
  return (
    <div>
      {this.state.members.map(member => <MemberThumbnail
        name={member.full_name} title={member.title}
      />)}
    </div>
  );
}

// Where 'this' refers to the component referenced above
select: function(event, ui) {
  this.setState({members: this.state.members.concat(ui.item)});
}
Поделиться
  • 0
    Ах, хорошо, я тоже так думал. Так что пусть компонент <MemberThumbnail /> будет считаться плюралистическим, а затем запустить его через цикл. Затем все, что мне нужно изменить, - это количество данных, которое в нем содержится, а затем перерисовать его. Brilliant! Круто, просто хотел убедиться, что это лучший способ сделать это.
  • 0
    Будет ли setState запускать MemberThumbnail для перезагрузки?
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню