Ошибка Babel: значение JSX должно быть либо выражением, либо текстом JSX в кавычках

Я получаю сообщение об ошибке от Babel при попытке скомпилировать мой код JSX в JS. Я новичок, чтобы реагировать, поэтому извиняюсь, если это очевидная проблема, я не смог найти ничего об этом, что казалось бы связанным. Я пытаюсь использовать реквизиты в этом фрагменте кода и передать реквизит pageTitle моему компоненту FieldContainer. Однако это вызывает у меня проблему, которая не позволяет коду компилироваться в JS. При поиске я обнаружил, что значения свойств должны передаваться между {}, но их добавление не помогло. Любые идеи? Спасибо!

Вавилонская ошибка


person Ruben Martinez Jr.    schedule 15.09.2015    source источник
comment
Пожалуйста, включите фактический код в вопрос.   -  person loganfsmyth    schedule 15.09.2015
comment
devDependencies: { babelify: ^6.4.0, // Понизить версию babelify может помочь в package.json и запустить npm install   -  person signonsridhar    schedule 01.11.2015


Ответы (3)


Трудно сказать, что вы пытаетесь здесь сделать, но, как говорит ошибка, значением атрибута должно быть выражение {foo} или текст в кавычках "foo".

В таком случае

Child={<LoginForm />}

or

Child={LoginForm}

это, вероятно, то, что вы хотите.

person loganfsmyth    schedule 15.09.2015
comment
Это было оно! Ух ты. Я предположил, что вам не нужны {} с именами переменных. Я такой глупый. Благодарю вас! - person Ruben Martinez Jr.; 15.09.2015
comment
Спасибо за решения. - person AMIC MING; 29.11.2017
comment
если значение аргумента числовое, как я должен это сделать? <foo top={30}>? <foo top=30> не компилируется, тогда как <foo top="30">, но это значение, обработанное как строка, дает странное поведение при управлении. - person Jack; 01.07.2021
comment
@ Джек <foo top={30}> кажется в порядке. - person loganfsmyth; 02.07.2021
comment
@loganfsmyth спасибо, я думал, что это хакерство или что-то в этом роде... Я знал, как отреагировать - person Jack; 02.07.2021

Я получил эту ошибку, потому что мне не удалось указать свойство внутри JSX:

<span aria-hidden=true ...

должно было

<span aria-hidden="true" ...
person Ben    schedule 25.03.2016

Только что столкнулся с такой же проблемой, я писал

component="Contacts"

разрешил это, переписав его как:

component={Contacts}

person Prem Sagar    schedule 04.07.2021