SemanticUiReact <下拉列表>组件上的<formattedmessage>

时间:2019-05-09 08:27:50

标签: javascript reactjs semantic-ui semantic-ui-react

我正在将React-intl与语义UI React结合使用,并且在将两者结合在一起时遇到了一些困难。 在可扩展子菜单上,我希望在

中添加“语言”文本

当前代码

 <Dropdown pointing='right' /*HERE I WISH TO ADD A TEXT IN <FormattedMessage>*/ >   
     <Dropdown.Menu>
              <Dropdown.Header>
  <div className="SubnavigationBarFormattedMessage"> <FormattedMessage id="navigationBar.chooseLanguage"/> </div>   
               </Dropdown.Header>
          <Dropdown.Item onClick={() => this.props.setLocale("en")}> <img src={ENG} alt="Eng" /> <p className="lang"> English     </p> </Dropdown.Item> <hr/>
          <Dropdown.Item onClick={() => this.props.setLocale("se")}> <img src={SWE} alt="Swe" /> <p className="lang"> Svenska     </p> </Dropdown.Item> <hr/>
          <Dropdown.Item onClick={() => this.props.setLocale("de")}> <img src={DEN} alt="Den" /> <p className="lang"> Dansk       </p> </Dropdown.Item> <hr/>
          <Dropdown.Item onClick={() => this.props.setLocale("no")}> <img src={NOR} alt="Nor" /> <p className="lang"> Norsk       </p> </Dropdown.Item>
   </Dropdown.Menu>
</Dropdown>

Current Output

我尝试了这些,但是它们都提供了编译错误。

<Dropdown pointing='right' <div className="test"> <FormattedMessage id="navigationBar.chooseLanguage"/> </div>   >   

<div> <Dropdown pointing='right'> <div className="test"> <FormattedMessage id="navigationBar.chooseLanguage"/> </div>      

如果我不使用和以下语法,则这样做:

<Dropdown pointing='right' text="language"> 该图标会显示在右侧,是否可以将指向箭头图标简单地放在“语言”文本的左侧?

Current Output

任何有关如何解决此问题的建议将不胜感激。

0 个答案:

没有答案