Page Not redirect

Here is my route.js code

import ApplicationApp from './ApplicationApp.vue'; import VueRouter from 'vue-router';

import view from './component/view.vue'; import save from './component/save.vue'; import edit from './component/edit.vue';

window.axios = require('axios');

export default new VueRouter({ routes: [ { path: '/', name: 'applicationlist', component: ApplicationApp,

        children: [
            {
                path: '/view/:applicationId',
                name: 'applicationlist.edit',
                component:edit
            },
            {
                path: '/view/:applicationId',
                name: 'applicationlist.view',
                component:view
            },
        ]
    }
  ]

});

Here is my application.js code

import router from './route'; import Vue from 'vue' import VueRouter from 'vue-router'; Vue.use(VueRouter)

import 'element-ui/lib/theme-chalk/index.css' import Element from 'element-ui' import locale from 'element-ui/lib/locale/lang/en'

Vue.use(Element, {locale})

new Vue({ router, }).$mount('#app');

Here is my Application

Application List

<el-table :data="applicationlist" stripe border > <el-table-column prop="id" label="ID" > </el-table-column> <el-table-column prop="" label="Applicant Name" > </el-table-column>

            <el-table-column
                   width="220"
                  label="Action ">
                  <template slot-scope="scope">
                     <el-button type="primary" round @click="handleEdit(scope.row.id)"><i class="el-icon-edit"></i></el-button>
                     <el-button type="success" round @click="handleView(scope.row.id)"><i class="el-icon-view"></i></el-button>
                     <el-button type="danger" round @click="handleDelete(scope.row.id)"><i class="el-icon-delete"></i></el-button>
                  </template>
            </el-table-column>

            
            </el-table>
       </div>
    </div>

       <div class="col-md-12">
            <li @click.prevent="handleNextPage(1)"><a href="">Previous</a></li>
       </div>
       <div class="col-md-12">
            <li @click.prevent="handleNextPage(2)"><a href="">Next</a></li>
       </div>
    </div>
</div>

export default {

    data () {

        return {

             applicationlist:[],

        }
    },

    methods: {
        handleView(id) {
            
            this.$router.push({
                'name': 'applicationlist.view',
                'params': {
                    'applicationId': id,
                }
            });

        },
        handleNextPage(page) {
             axios.get('http://127.0.0.1:8000/admin/applicationlist?page='+page)
            .then((response) => {
                this.applicationlist = response.data.applicationList.data
            })
            .catch((error) => {

            })
        }
    },
    mounted () {

        // var app = 'http://127.0.0.1:8000/';
      
        axios.get('http://127.0.0.1:8000/admin/applicationlist')
            .then((response) => {
                this.applicationlist = response.data.applicationList.data
            })
            .catch((error) => {

            })

        
    },

}