Babel error: JSX value should be either an expression or a quoted JSX text

Question

我在尝试将我的 JSX 代码编译成 JS 时从 Babel 收到错误。如果这是一个明显的问题，我是新来的，所以很抱歉，我找不到任何似乎相关的东西。我试图在这段代码中使用道具，并将 pageTitle 道具传递给我的 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}

Babel error: JSX value should be either an expression or a quoted JSX text

Babel error: JSX value should be either an expression or a quoted JSX text

reactjs

react-jsx

babeljs