React todo list: Creating a new array to concat existing todos with new ones

JavaScript
1

Tell us what’s happening:
I Wanted to know : is the following code a good design for adding new elements to existing array in my app state, i have a hunch that i can do better, but not sure how , also i dont want to loose my previous todos

My area of concern is handleSubmit():

Your code so far

‘’‘handleSubmit() {
let itemsArray = this.state.userInput.split(’,’); //creating an array for fetching list of , saperated strings
let tempList = (this.state.toDoList).concat(itemsArray); //Adding new array to exisitn through concat

this.setState({
toDoList: tempList
});
}’’’


const textAreaStyles = {
  width: 235,
  margin: 5
};

class MyToDoList extends React.Component {
  constructor(props) {
    super(props);
    // change code below this line

    // change code above this line
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleChange = this.handleChange.bind(this);
  }
  handleSubmit() {
   let itemsArray = this.state.userInput.split(',');
   let tempList = (this.state.toDoList).concat(itemsArray);
   this.setState({
     toDoList: tempList
   });
 }
  handleChange(e) {
    this.setState({
      userInput: e.target.value
    });
  }
  render() {
    const items = null; // change code here
    return (
      <div>
        <textarea
          onChange={this.handleChange}
          value={this.state.userInput}
          style={textAreaStyles}
          placeholder="Separate Items With Commas" /><br />
        <button onClick={this.handleSubmit}>Create List</button>
        <h1>My "To Do" List:</h1>
        <ul>
          {items}
        </ul>
      </div>
    );
  }
};

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.14; rv:67.0) Gecko/20100101 Firefox/67.0.

Link to the challenge: