Why setState not set appending my array into state?

Question

I have to create a text area which taken multiple links then I split() into array yeah Its working fine, but I want to set that array into my state in

Answer 1

The below code might help.

onSubmit = event => {
    this.setState({ loading: true, host: undefined }, () => {
      const { text, linkList } = this.state;

      console.log(link);
      const mList = text.split("\n").filter(String);
      console.log(mList);
      this.setState({
        linkList: [...mList]
      }, () => {
        console.log(linkList);
        event.preventDefault();
      });
    });
  };

Answer 2

It probably is being appended, it's just not available until the next render.

From the documentation:

setState() does not always immediately update the component. It may batch or defer the update until later. This makes reading this.state right after calling setState() a potential pitfall. Instead, use componentDidUpdate or a setState callback (setState(updater, callback)), either of which are guaranteed to fire after the update has been applied.

Answer 3

setState is asynchronous. That means it doesn't happen right away, but a very short time later instead. If you add a:

console.log(linkList)

to the top of your render method, you will see the items being appended just as you expect.