如何在同一行上显示文本和组件文本

Question

我有一个包含一些文本的div，然后是一个显示更多文本的组件：

   <div className="text-center">
      Sign-in or <SignUpLink />
    </div>

我希望它像这样显示内联文本：

  

登录或创建帐户

但是它却显示为：

  

登录或

     

创建帐户

我该如何解决？

Answer 1

赋予SignUpLink一种display: inline风格。

const SignUpLink = () => {
  <div style={{ display: 'inline' }}>
    // rest of component
  </div>
}