Babel错误：JSX值应该是表达式或带引号的JSX文本

Question

我在尝试将JSX代码编译成JS时遇到了Babel的错误。如果这是一个明显的问题，我是新来的，如此道歉，我无法找到任何与之相关的内容。我试图在这段代码中使用props，并将pageTitle prop传递给我的FieldContainer组件。这给了我一个问题，那就是不要让代码编译成JS。我在搜索中发现，道具值应该在{}之间传递，但添加这些值并没有帮助。有任何想法吗？谢谢！

Answer 1

很难说出你要在这里做什么，但正如错误所说，属性的值必须是表达式{foo}或引用文本"foo"。

在这种情况下

Child={<LoginForm />}

或

Child={LoginForm}

可能就是你想要的。

Answer 2

我收到此错误是因为我没有在JSX中引用属性：

<span aria-hidden=true ...

应该是

<span aria-hidden="true" ...

Answer 3

刚遇到同样的问题，我正在写

component="Contacts"

通过将其重写为：

component={Contacts}