Material-ui: O componente Material-UI Paper não reconhece o caractere de nova linha
Estou passando para o componente Material-UI Paper uma string que contém um novo caractere de linha. No entanto, o componente Paper parece estar ignorando isso, pois não está iniciando uma nova linha. Esse comportamento é intencional ou é um bug. O código em questão está abaixo (comment.text é a string em questão):
<Paper key={index} rounded={false} style={styles.paper}>
<div>{comment.text}</div>
<div style={{textAlign: 'right', color: grey500}}>{comment.user + ", " + comment.date}</div>
</Paper>
alexanderwhatley
Todos 5 comentários
@alexanderwhatley Qual é o valor de comment.text ? E quais versões de tudo você está usando? O modelo que fornecemos é para ajudar a responder às perguntas de forma mais eficiente. 😁
m2mathew
em 17 nov. 2017
Ei @ m2mathew , desculpe por isso. A versão de material-ui é 0.17.4 e o valor de comment.text é "Olá, como \ n você está?"
alexanderwhatley
em 17 nov. 2017
Bem, pense em como o DOM lidaria com isso. Eu esperaria que \n renderizasse se eu colocasse isso entre dois <div> s em um arquivo HTML.
Como isso não está relacionado explicitamente ao MUI, encerrarei este problema. Certifique-se de acessar Stack Overflow ou semelhante para obter mais ajuda na implementação de conteúdo no DOM.
m2mathew
em 17 nov. 2017
Eu usei: style={{whiteSpace: 'pre-line'}}
<Typography
variant="body1"
style={{whiteSpace: 'pre-line'}}
>
{body}
</Typography>
Referência:
https://stackoverflow.com/questions/39325414/line-break-in-html-with-n
ericksprengel
em 24 fev. 2019
Parece que vale a pena um suporte adicional no componente "Tipografia".
goodwin64
em 5 dez. 2019
Questões relacionadas
ryanflorence
·
3Comentários
pola88
·
3Comentários
mattmiddlesworth
·
3Comentários
ghost
·
3Comentários
mb-copart
·
3Comentários
Comentários muito úteis
Eu usei:
style={{whiteSpace: 'pre-line'}}Referência:
https://stackoverflow.com/questions/39325414/line-break-in-html-with-n