Проблема с отображением результата запроса

class Movie extends Component {
    constructor(props){
        super(props);
 
        this.state = {
            list: []
        }
    }
 
    query(se){
        axios.get(`http://www.omdbapi.com/?i=tt3896`+se+`8&apikey=2cc0d8ab`)
          .then(response => {
              if(response.data.Response === "True"){
                  this.state.list.push(response.data);
              }
          });
    }
 
    componentWillMount(nextProps, nextState, nextContext) {
        for (let i = 0; i < 19; i++){
            if (i <= 9) {
                i = `0${i}`;
            }
            this.query(i);
        }
    }
 
    shouldComponentUpdate(nextProps, nextState, nextContext) {
        return true;
    }
 
    render(){
        return(
          <main>
              {console.log(this.state.list)}
              <Mov list={this.state.list}/>
          </main>
        );
    }
}
 
 
 
class Mov extends Component {
    constructor(props){
        super(props);
 
        this.state = {
            list: this.props.list
        }
    }
 
    render() {
        return(
          <div>
              {this.state.list.map((dt, index) => (
                <h1 key={index}>{dt.Title}</h1>
              ))}
          </div>
        );
    }
}

    query(se){
        axios.get(`http://www.omdbapi.com/?i=tt3896`+se+`8&apikey=2cc0d8ab`)
          .then(response => {
              if(response.data.Response === "True"){
                  this.setState({
                       list: [...this.state.list, response.data]
                       // или так
                       // list: this.state.list.concat([response.data])
                       // есть кучу способов как вернуть новый массив с добавленным элементом
                  })
              }
          });
    }