在输入占位符中调用组件

Question

我目前正在尝试在文本占位符的位置调用React组件，但它返回[Object object]。以下是输入

render(){
const myText = this.movingText();
<input placeholder={myText}/>
 }

然后这是我用组件打字标签调用的函数。

movingText() {
  return (
   <Typist>
    Hello this is the text
  </Typist>
    )}

所以我真的试图将组件及其内容称为占位符。任何帮助深表感谢。感谢

Answer 1

在你的渲染......

render(){
 const myText = this.movingText();
return(
 <input placeholder={myText}/>

  )
}

Answer 2

使用renderToString作出反应，如下所示

import { renderToString } from 'react-dom/server';
const myText = renderToString(this.movingText());

return(
 <input placeholder={myText}/>
)
}