admin 管理员组

文章数量: 1086019

What I'm trying to do is that I want to add a line break between

remoteMessage.notification.title + remoteMessage.notification.body

title and body

If I use my code screen view show like this

this is my code

useEffect(() => {
  const unsubscribe = messaging().onMessage(async (remoteMessage) => {
    console.log(JSON.stringify(remoteMessage));
    Alert.alert(
      "A new FCM message arrived!",
      JSON.stringify(
        remoteMessage.notification.title + remoteMessage.notification.body
      )
    );
  });

  return unsubscribe;
}, []);

How can I fix my code? if I want to show like this?

title 
body

What I'm trying to do is that I want to add a line break between

remoteMessage.notification.title + remoteMessage.notification.body

title and body

If I use my code screen view show like this

this is my code

useEffect(() => {
  const unsubscribe = messaging().onMessage(async (remoteMessage) => {
    console.log(JSON.stringify(remoteMessage));
    Alert.alert(
      "A new FCM message arrived!",
      JSON.stringify(
        remoteMessage.notification.title + remoteMessage.notification.body
      )
    );
  });

  return unsubscribe;
}, []);

How can I fix my code? if I want to show like this?

title 
body
Share Improve this question edited Mar 27, 2021 at 10:30 Manas Khandelwal 3,9462 gold badges14 silver badges25 bronze badges asked Mar 27, 2021 at 10:28 user15322469user15322469 9093 gold badges14 silver badges36 bronze badges 6
  • Use title + '\n' + body – Pavlo Zhukov Commented Mar 27, 2021 at 10:32
  • 4 What has this to do with JSON? – Andreas Commented Mar 27, 2021 at 10:33
  • 2 And why do you call JSON.stringify() on a string? – Andreas Commented Mar 27, 2021 at 10:33
  • 1 duplicate ? – rustyBucketBay Commented Mar 27, 2021 at 10:36
  • 1 What you use for the line break depends on where the text is going to be displayed. The fact you're storing it in JSON beforehand is irrelevant – ADyson Commented Mar 27, 2021 at 10:48
 |  Show 1 more ment

3 Answers 3

Reset to default 2

You can use \n and white-space: pre-line; CSS:

const text = "Title\nBody"

function App() {
  return <div className="pre-line">{text}</div>
}

ReactDOM.render(<App />, document.getElementById('root'))
.pre-line {
  white-space: pre-line;
}
<script crossorigin src="https://unpkg./react@17/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg./react-dom@17/umd/react-dom.production.min.js"></script>
<body>
<div id="root"></div>
</body>

You can use \n, otherwise, You can try with <br/> between two texts.

useEffect(() => {
  const unsubscribe = messaging().onMessage(async (remoteMessage) => {
    console.log(JSON.stringify(remoteMessage));
    Alert.alert(
      "A new FCM message arrived!",
      JSON.stringify(
        remoteMessage.notification.title +"<br/>"+ remoteMessage.notification.body
      )
    );
  });

  return unsubscribe;
}, []);

If you know how to handle CSS (I hope you are a front developer), you can line break it with a bination of css' white-space: break-spaces and '\n'.

your.json file

{
   text: "I want to show you \nthe text that is line break."
}

your.css file

p {
   white-space: break-spaces;
}

Maybe it looks like this.

I want to show you
the text that is line break.

本文标签: javascripthow can i add Line break in JSONStack Overflow