如何在材料ui中文本包装菜单项.

Question

所以我需要在popover中显示一个文本.我有以下代码使文本出现在一行中.我需要将文本换行以将它们放在多行中,但是我认为原因但到目前为止我的更新还没有成功.任何的想法？

                            <Popover
                                anchorEl={target}
                                open={open}
                                anchorOrigin={{horizontal: 'middle', vertical: 'bottom'}}
                                targetOrigin={{horizontal: 'left', vertical: 'bottom'}}
                                onRequestClose={handleRequestClose}
                                animation={PopoverAnimationVertical}>
                                <Menu
                                    autoWidth={true}
                                    >
                                    <MenuItem style={{width: "200px",   height: "200px"}}>  
                                       <p style={{display: "flex", flexWrap: "wrap"}}>'aslkjflajdsljflskdjflsdfjlsjdfjdfjlasjkfadlsf'</p> 
                                     </MenuItem> //this does not work....
                                </Menu>

Answer 1

尝试重置whiteSpace样式 -

 <MenuItem style={{whiteSpace: 'normal'}}>  
   <p>This song is just six words long. This song is just six words long.  This song is just six words long.  This song is just six words long.</p> 
 </MenuItem>