Why doesn't the $router.push( ) call work?

Question

Vue.js

There is a component for displaying posts with the possibility of pagination:

<template>
    <v-container grid-list-md>
        <v-layout row wrap>
<!--Блок с контентом-->
            <v-flex sm6 v-for="customer in customers">
                <v-card>
                    <v-card-title>
                        <div>
                            <v-btn fab small>
                                {{customer.id}}
                            </v-btn>
                            <v-icon>fas fa-phone</v-icon>
                            {{customer.phone}}
                        </div>
                    </v-card-title>
                </v-card>
            </v-flex>

<!--Блок пагинации-->
            <div class="text-xs-center">
                <v-btn fab dark small
                       v-for="i in +pageCount"
                       :color="(i == curPage) ? 'primary' : 'blue-grey'"
                       @click="paginate(i)"
                >{{i}}
                </v-btn>
            </div>


        </v-layout>
    </v-container>

</template>

<script>
    import axios from 'axios';

    export default {
        name: 'Customer',
        data() {
            return {
                customers: [],
                curPage: 0,
                pageCount: 0,
            }
        },

        created() {
            this.loadCustomers();
        },

        methods: {

            loadCustomers() {
                let fullPath = this.$route.fullPath;
                axios.get('http://rest.loc' + fullPath)
                    .then(response => {
                        this.customers = response.data;
                        let headers = response.headers;
                        this.curPage = headers['x-pagination-current-page'];
                        this.pageCount = headers['x-pagination-page-count'];
                    })
                    .catch(e => {
                        console.log(e);
                    })
            },

            paginate(number) {
                this.$router.push('/customers?page=' + number);
                //Как сделать чтобы работало без следующей строчки
                this.loadCustomers();
            }
        }
    }
</script>

1. Pagination only works if you call loadCustomers().
2. When you click forward or back in the browser, the address in the line changes, but the data on the page does not.
What am I missing?

I will also give router.js

import Vue from 'vue'
import Router from 'vue-router'
import Home from './components/Home.vue'
import About from './components/About.vue'
import Customer from './components/Customer'

Vue.use(Router)

export default new Router({
  mode: 'history',
  routes: [
    {
    	path: '/',
    	name: 'Home',
    	component: Home
    },
    {
    	path: '/about',
    	name: 'about',
    	component: About
    },
    {
    	path: '/customers',
    	name: 'customers',
    	component: Customer
    }
  ]
})

Answer 1

The component instance is not recreated when the page is changed, so the created hook is not called, the loadCustomers method, respectively, is also not called.
You need to set up page change tracking , like this:

watch: {
  '$route.query.page'() {
    this.loadCustomers();
  },
},

Or like this (in this case, you do not need to call the loadCustomers method in created):

watch: {
  '$route.query.page': {
    immediate: true,
    handler: 'loadCustomers',
  },
},

Answer 2

Maybe like this?:
.push({path:'/customers?page=' + number});