React Js：変数に変数を格納して後で使用する

Question

funcというファンクションからReact Componentを返す必要があり、別のファイルにレンダリングしたい場合があります。コンポーネントはFiddle

class A extends React.Component { 
    render() { 
    var val = B.func("hii"); 
    return (
     <div> 
     {val} 
     </div> 
    ) 
    } 
} 

B.js

let B = { 
    func: function(msg) { 
    return msg.replace(/i/g, function myFunction(x){ 
     var imgTag = <span>Hello</span> 
     return imgTag; 
    }); 
    } 
} 

私はこれをレンダリングしたいが、それは、[オブジェクトのオブジェクト]としてレンダリングに[object Object]として

リンクをレンダリングします。私は何が間違っているか見ることができません。

Answer 1

テキストの一部を反応コンポーネントで置き換える場合は、replace関数だけでは、反応エレメントオブジェクトを文字列に変換しようとしているため、これを行うことはできません。 私はあなたのパターンにマッチし、要素の配列を作成し、Reactでそれをレンダリングするより良い方法だと思います。

たとえば、あなたがtransofrmする必要があります。

'some text REPLACEME other text'

へ：

['some text', React.createElement('A', {}, null), 'other text']

カントが今より良いコードの例を提供し、申し訳ありません; D