Question

尝试渲染React.Fragment时出现此错误：

错误：

Cannot convert a Symbol value to a string

部分代码传递给组件：

render{
    const block = {
      type : 'menu',
      className: 'c-header-nav__item c-header-nav__item--lv1',
      content: (
      <React.Fragment>
        <Link to = "https://www.google.com" title = "replace this dummy text" className = "c-header-nav__link" icon = "c-header-nav__item-icon js-show-submenu" >Áreas de negocio</Link>
        <div className="c-header-nav__submenu">
          <List className = "c-header-nav__item c-header-nav__item--lv2" type = "headerNavItem" elements = {[
            {
              className: "prueba",
              content: "hola"
            }
          ]} />
        </div>
      </React.Fragment>)
    }


  return (
    <div>
      <AnyComponent block = {block} />
    </div>
  )
}

正在接收内容的AnyComponent中呈现内容部分：

<div>
  { this.props.block.content }
</div>

我不知道为什么会这样，但这可能是一个错误。

我的React和ReactDom版本是：

"react": "^16.6.3",
"react-dom": "^16.6.3",

Answer 1

我发现了问题。

我的项目是使用 storybook 的组件存储库，事实证明，不支持通过故事传递片段。

但是，我没有时间去探索为什么会发生这种情况，或者没有在github上打开Issue的时间，但是，一旦我传递了片段并将其渲染成这样：

https://stackblitz.com/edit/react-mksklc?file=Hello.js

一切都按预期进行。

欢呼

反应片段序列化。错误：无法将符号值转换为字符串

1 个答案: