Блог

У меня есть код, который генерирует мой пользовательский интерфейс react, и он работает со списком языков для создания флажков для выбора языка. Например, когда в штате

 languages = {English: true, French: false}   

однако, когда я изменяю его на объект, содержащий значения из БД, я не получаю ошибок, но ничего не загружается.

 [ {  "language_name": "English",  "lang_num": 1,  "checked": false }, {  "language_name": "Mandarin Chinese",  "lang_num": 2,  "checked": false }, ]  

Код такой:

 {   Object.entries(this.props.languages).forEach(([key, value]) =gt; {  console.log(this.props.languages[key].language_name),  lt;label id="checkbox-margin"gt;  lt;input  type="checkbox"  value={this.props.languages[key].language_name}   checked={this.props.languages[key].checked}  onChange={this.handleLangClick}  /gt; {this.props.languages[key].language_name}  lt;/labelgt;  }  )  

Консоль.в журнале перечислены все языковые строки, я печатаю их все в консоли, но в пользовательском интерфейсе ничего не генерируется. Есть идеи, почему?

Спасибо!

Попробуйте использовать map функцию для перебора массива:

 {this.props.languages ? this.props.languages.map(language =gt; {  return (  lt;label id="checkbox-margin" key={language.lang_num}gt;  lt;input  type="checkbox"  value={language.language_name}   checked={language.checked}  onChange={this.handleLangClick}  /gt; {language.language_name}  lt;/labelgt;  )}) : 'Loading languages...' }