Не удается прочитать свойство 'карта' из неопределенного - ошибка из ReactJS

Question

Сообщение об ошибке:

Ошибка: невозможно прочитать свойство 'map' из неопределенного

Реагировать компонент:

const checkBox = props => {
  return (
    <div>
      <label for={props.name} className="form-label">
        {props.title}
      </label>
      <div className="checkbox-group">
        {props.options.map(option => {
          return (
            <label key={option}>
              <input
                className="form-checkbox"
                id={props.name}
                name={props.name}
                onChange={props.handleChange}
                value={option}
                checked={props.selectedOptions.indexOf(option) > -1}
                type="checkbox"
              />{" "}
              {option}
            </label>
          );
        })}
      </div>
    </div>
  );
};

в моем кодечто-то идет не так?Если да, пожалуйста, дайте мне знать.Может ли кто-нибудь помочь мне в этом?

Ошибка

Невозможно прочитать свойство 'map' из неопределенного

, когда функция карты вКомпонент списка комментариев выполнен.

Answer 1

Вы также можете использовать простой запасной вариант, например.

const checkBox = props => {
  const { options, name, titlem, selectedOptions, handleChange } = props

  return (
    <div>
      <label for={name} className="form-label">
        {title}
      </label>
      <div className="checkbox-group">
        {(options || []).map(option => {
          return (
            <label key={option}>
              <input
                className="form-checkbox"
                id={name}
                name={name}
                onChange={handleChange}
                value={option}
                checked={selectedOptions.indexOf(option) > -1}
                type="checkbox"
              />{" "}
              {option}
            </label>
          );
        })}
      </div>
    </div>
  );
};

Answer 2

Комментарий к вопросу ссылается на учебник , показывающий, как построить форму и ее подкомпоненты.Несколько компонентов включают примеры того, как передать props, но этого не хватает в <Checkbox/>.

Чтобы заполнить этот пробел, вот пример того, как вы можете ожидать использовать <Checkbox/>.Я не читал статью полностью, поэтому надеюсь, что вы поможете исправить любые ошибки, которые я здесь сделал, и это поможет вам начать собственное развитие.

<Checkbox
       title={'Skills'}
       name={'skills'}
       options = {this.state.skills} <!-- array of skills or empty array -->
       selectedOptions = {this.state.newUser.skills} <!-- array of skills or empty array -->
       handleChange = {this.handleInput}
/>