反応すると、コンポーネントの子をラッパーなしでレンダリングできますか？

Question

私がやりたい：

render:() -> 
     {@props.children} 

それは私がやらせている。

render:() -> 
     <div>{@props.children}</div> 

レンダリングされた子どもたちが自分の所有者ベースのコンテキストが設定されているので、私は、元をやりたい理由があります。しかし、それらをラッパーでレンダリングすると、親である要素にはコンテキストが設定されません。

所有者ベースと親ベースの文脈が異なる（値：[object Object]対undefined）キー（x）のためにこれはここで議論されて

：これは、警告を生成https://gist.github.com/jimfb/0eb6e61f300a8c1b2ce7

をしかし、何の解決策を提供していません。

警告は、子をレンダリングするコンポーネントが「所有者」であり、設定コンテキストですが、divラッパー要素が「親」でコンテキストがないために発生します。私の考えはdivを取り除くことでした。しかし、私はそれを取り除くことはできません。状況で

render() { 
    if (!this.props.children) { 
    return null; 
    } else if (React.isValidElement(this.props.children)) { 
    return this.props.children; 
    } 
    return <span>{this.props.children}</span>; 
} 

Answer 1

は

render() { 
    return React.Children.only(this.props.children) 
} 

これはどのような反応-Reduxのですconnect()、FWIWで使用します。

Answer 2

単一の子供が必要とされています：私はtext子供にラッパー<span>を使用するには、次のコードを使用しました