Предупреждение: неизвестный класс свойств DOM. Вы имели в виду имя?

Я только начал изучать React, добавив компонент с простой функцией рендеринга:

render() {
  return <div class="myApp"></div>
}

когда я запускаю приложение, я получаю следующую ошибку:

Warning: Unknown DOM property class. Did you mean className?

Я могу решить эту проблему, изменив class to className.

вопрос в том, выполняет ли React эту конвенцию? И почему мне нужно использовать className вместо обычного class? Если это ограничение, то это связано с синтаксисом JSX или где-то еще?

4 ответов


Да, это конвенция React:

поскольку JSX является JavaScript, идентификаторы, такие как class и for несколько не рекомендуется как имена атрибутов XML. Вместо этого компоненты React DOM ожидайте имена свойств DOM, такие как className и htmlFor, соответственно.

https://facebook.github.io/react/docs/jsx-in-depth.html#html-tags-vs.-react-components


Meteor использует babel для транспилирования ES5 в ES6 (ES2015), поэтому мы можем иметь дело с ним как с обычным приложением узла с добавленным Babel transpiler.

вам нужно добавить .babelrc файл в корневую папку вашего проекта и добавьте следующие элементы

{
  "plugins": [
    "react-html-attrs"
  ]
}

и, конечно же, вам нужно установить этот плагин с помощью npm:

НПМ установки --save-dev и Бабель-плагин-реагировать на HTML-у attrs


вы не можете использовать class для любого атрибута тега HTML, потому что JS имеет другое значение class. Вот почему вы должны использовать className вместо class.

а также использовать атрибут htmlFor вместо for.


In React.js нет свойств for и class, поэтому нам нужно использовать

for   --> htmlFor
class --> className