validateDOMNesting (...): <span>не может отображаться как дочерний элемент <option> - PullRequest
Новая
       13

validateDOMNesting (...): <span>не может отображаться как дочерний элемент <option>

0 голосов
/ 29 августа 2018

Я использую react-intl для интернализации. Я получаю ошибку validateDOMNesting(...): <span> cannot appear as a child of <option> для следующего кода.

Я не использую span. Но при осмотре элемента он автоматически принимает пролет.

Вот код: 

<select onChange={this.localeChageHandler}>
   <option value="english">
      <FormattedMessage
        id="navigation.header.navbar.english"
        defaultMessage="English"
      />
   </option>
   <option value="hindi">
     <FormattedMessage id="navigation.header.navbar.hindi" defaultMessage="HIndi" />
   </option>
</select>

1 Ответ

0 голосов
/ 29 августа 2018

Обычно FormattedMessage возвращает элемент span, чтобы игнорировать элемент span, необходимо передать опции потомкам prop в FormattedMessage. 

    <select onChange={this.localeChageHandler}>
              <FormattedMessage
                id="navigation.header.navbar.english"
                defaultMessage="English"
                children={
                  (formatedMessage) => <option value="English">{formatedMessage}</option>
                }
              />
          <FormattedMessage
                id="navigation.header.navbar.hindi"
                defaultMessage="HIndi"
                children= {
                  (formatedMessage) => <option value="HIndi">{formatedMessage}</option>
                }
              />
        </select>
...