reactjs - react Js : Store React Component in a variable and use it later

Question

我有一个案例，我需要从一个名为 func 的函数返回 React Component 并想在另一个文件中呈现它。组件呈现为 [object Object]

链接到 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

如果你有一些文本，你想用 React 组件替换文本的某些部分，你不能只使用 replace 函数来做到这一点，因为你试图将 React 元素对象转换为字符串.我认为更好的方法是匹配您的模式并创建一个元素数组，以在 React 中呈现它。

比如你需要transofrm:

'一些文本替换其他文本'

收件人:

['一些文本', React.createElement('A', {}, null), '其他文本']

现在不能提供更好的代码示例，抱歉;D