reactjs - React js文本不适合屏幕

Question

我正在开发一个 reactJS 网络应用程序。我从服务器获取一个值，我想在网格项中显示它，但问题是该值是一个长文本，我的代码中的值是{signature}，当它显示时它不适合屏幕。这是我的尝试

  <Paper className={classes.paper}>
 <Grid container spacing={3} wrap="wrap">  
  <Grid  item xs  > 
              Your Signature:        
              <div style={{ flexWrap:'wrap' }}>
              {signature}
              </div>
            </Grid>
          </Grid>
        </Paper>
        <Copyright />

这是结果的屏幕截图：

标签： reactjs

Answer 1

这是一个简单的 CSS 问题。你可以试试这个。

<div style={{ maxWidth: '100%', overflow: 'hidden', wordBreak: 'break-all' }}>