React todo list отображает todo onChange, а не onSubmit

Question

Я немного новичок в React, и со всеми новыми усилиями по программированию я создаю приложение todo. Кажется, что все работает правильно, за исключением одной проблемы: когда я вводил todo в поле ввода и нажимаю «отправить», todo вставляется в мой массив, однако он не отображается сразу. Только когда я изменяю текст внутри ввода, отображается отображение todo. Я предполагаю, что это имеет какое-то отношение к рендерингу, выполняемому функцией handleChange, а не к функции handleSubmit. Любая помощь будет принята с благодарностью.

Вот мой AddTodo компонент

import React, { Component } from 'react'; 
import App from "./App" 
import List from "./List" 


class AddTodo extends React.Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     value: '', 
     array: [] 
    }; 

    this.handleChange = this.handleChange.bind(this); 
    this.handleSubmit = this.handleSubmit.bind(this); 
    } 

    handleChange(event) { 
    this.setState({value: event.target.value}); 
    } 

    handleSubmit(event) { 
    event.preventDefault(); 
    var array = this.state.array 
    array.push(this.state.value); 
    console.log(array) 
    } 

    render() { 
    return (
     <div> 
     <form> 
      <label> 
      Name: 
      <input type="text" value={this.state.value} onChange={this.handleChange} /> 
      </label> 
      <input onClick={this.handleSubmit} type="submit" value="Submit" /> 
     </form> 
     <List array={this.state.array}/> 
     </div> 
    ); 
    } 
} 

И мой компонент Список

import React, { Component } from 'react'; 

class List extends Component{ 
    render(){ 
    return(
     <div> 
     { 
     this.props.array.map(function(item, index){ 
      return <li key={index}>{item}</li> 
     }) 
     } 
     </div> 
    ) 
    } 
} 

export default List; 

Answer 1

По умолчанию, вызов SetState() вызывает функцию визуализации(). Дополнительная информация здесь: ReactJS - Does render get called any time "setState" is called?