using split and map in jsx

Question

const arr = ['name', 'contact number']

const App = () => (
  <div style={styles}>
  Add {arr.split(',').map(o=>o)}
  </div>
);

why this won't work? I want to print Add name & contact, but stuck at splitting it.

Answer 1

You're using 2 functions wrong:

1. split is supposed to be used to split a string into an array, around the provided character. You already have the resulting array.
2. .map(o=>o) is useless - it basically returns the same array provided.

You're probably looking to do this Add {arr.join(' & ')} .

Answer 2

You are looking to join the values

Add {arr.join(',')}

Below links should help you

MDN split

MDN join

Answer 3

There is nothing to split. I think you are trying to join them:

const arr = ['name', 'contact number']

const App = () => (
  <div style={styles}>
  Add {arr.join(',')}
  </div>
);