how can i add Line break in JSON?

Question

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 has this to do with [JSON](https://www.json.org/json-en.html)? — Andreas, Mar 27 '21 at 10:33
[duplicate](https://stackoverflow.com/questions/42068/how-do-i-handle-newlines-in-json) ? — rustyBucketBay, Mar 27 '21 at 10:36
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, Mar 27 '21 at 10:48
Do you really need those `""` around? Because that's what you get from `JSON.stringify()`, otherwise the line could be `Alert.alert(remoteMessage.notification.title+'
'+remoteMessage.notification.body);`. — tevemadar, Mar 27 '21 at 10:57

Ruhul Amin · Answer 1 · 2021-03-27T10:45:49.207

1

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;
}, []);

edited Mar 27 '21 at 10:45

answered Mar 27 '21 at 10:37

Ruhul Amin

1
10
14

if the \n is not work then Please add
between texts. title + "
" + body – Ruhul Amin Mar 27 '21 at 10:40
Rather than adding parts of answer in the comments, you can edit the answer. – Manas Khandelwal Mar 27 '21 at 10:41

score 0 · Answer 2 · answered Mar 27 '21 at 11:52

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.com/react@17/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script>
<body>
<div id="root"></div>
</body>

how can i add Line break in JSON?

2 Answers2