Оборачиваем компоненты React в div, запутывая их - PullRequest
Новая
       1

Оборачиваем компоненты React в div, запутывая их

0 голосов
/ 07 апреля 2019

У меня есть такая игра: game

Я использую react-contexify, чтобы создать собственное контекстное меню в React. Вот мой код раньше: 

<MenuProvider key="0">
  <Message
    className="ChatMessage"
    style={{ width: isMobile() ? "60%" : "40%", backgroundColor: "#424751" }}
  >
    <h3 className="Username">{this.props.username}</h3>
    :&nbsp;
    <p className={Boolean(this.props.rainbow) ? "RainbowMessage" : "Message"}>
      {this.props.children}
    </p>
  </Message>

  <Menu>
    <Item>Lorem</Item>
    <Item>Ipsum</Item>
    <Separator />
    <Item disabled>Dolor</Item>
    <Separator />
    <Submenu label="Foobar">
      <Item>Foo</Item>
      <Item>Bar</Item>
    </Submenu>
  </Menu>
</MenuProvider>

И мой код после: 

<MenuProvider key="0">
                        <Message className="ChatMessage" style={{"width": isMobile() ? "60%" : "40%","backgroundColor": "#424751"}}>
                            <h3 className="Username">
                                {this.props.username}
                            </h3>
                            :&nbsp;
                            <p className={Boolean(this.props.rainbow) ? "RainbowMessage" : "Message"}>
                                {this.props.children}
                            </p>
                        </Message>

                        <Menu>
                            <Item>Lorem</Item>
                            <Item>Ipsum</Item>
                            <Separator />
                            <Item disabled>Dolor</Item>
                            <Separator />
                            <Submenu label="Foobar">
                            <Item>Foo</Item>
                            <Item>Bar</Item>
                            </Submenu>
                        </Menu>
                    </MenuProvider>

Но этот код приводит к этому: mygameafter

Это то же самое, что завернуть его в div ... Но почему? В чем дело? Спасибо

...