When I call the API it returns me 2 posts. When I call again it returns another 2 posts. But when i click the button for 2nd time, the first 2 posts removes automatically. **It should remain both the previous 2 posts and the next 2 posts**. How to do this?

my code:

```
//...existing code
        this.state={
            status:[],
            counter: 0,
            pageNumber: 1,
        }
    }
    componentDidMount(){
        let store = JSON.parse(localStorage.getItem('login'))
        var url = 'http://127.0.0.1:8000/myapi/allpost/?format=json&page='+this.state.pageNumber
        fetch(url,{
            method:'GET',
            headers: {
                'Content-Type': 'application/json',
                'Authorization': 'Token '+store.token
            }
        })
        .then(res=>res.json().then(result=>{
            this.setState({status: result, pageNumber: this.state.pageNumber+1})
        }))
    }

    morePosts=()=>{
        this.componentDidMount()
    }

    render() {
        if(Object.keys(this.state.status).length){
            var list = this.state.status.results
            const s = list.map((l,i)=>{
                return(
                    <Status key={i} body={l['body']} id={l['id']} />
                )
            })
            return (
                <div><br/>
                <div>
                    <div key={this.state.counter}>{s}</div>
                    <button onClick={this.morePosts}>See more posts</button>
                </div>
                </div>
            );
        }else {
            return (
                <div>
                <br/>
                    <p style={{textAlign:'center'}}>loading...</p>
                </div>            )
        }
    }
}

export default Home;

```

here is my API:

```
{
    "count": 26,
    "next": "http://127.0.0.1:8000/myapi/allpost/?page=2",
    "previous": null,
    "results": [
        {
            "id": 68,
            "body": "abc",
        },
        {
            "id": 67,
            "body": "de fg",
        }
    ]
}

```

When I call the API 2nd time:

```
{
    "count": 26,
    "next": "http://127.0.0.1:8000/myapi/allpost/?page=3",
    "previous": "http://127.0.0.1:8000/myapi/allpost/",
    "results": [
        {
            "id": 66,
            "body": "xyz",
        },
        {
            "id": 65,
            "body": "hi j",
        }
    ]
}

```