the page cannot jump during a vue-router jump. My code is as follows:
Index.jsimport Vue from "vue"
import Router from" vue-router" in
routrt
Vue.use (Router)
const Loading = resolve = > require ([".. / Views/Loading"], resolve)
const Layout = resolve = > require ([".. / Views/Layout"], resolve)
const Demo = resolve = > require ([".. / Views/Demo01"], resolve)
const Infromation = resolve = > require ([".. / Views/Infromation"], resolve)
const Like = resolve = > require ([".. / Views/Like"], resolve)
const Skill = resolve = > require ([".. / Views/Skill"] Views/Skill"
const router = new Router ({
routes: [
{
path: "/Loading",
name: "Loading",
meta:{
requireAuth: false
},
component: Loading
},
{
path: "/",
name:"Layout",
meta: {
requireAuth: true
},
component: Layout,
redirect: "/Layout", //
children:[{
path:"/Infromation",
mata:{
requireAuth: true
},
component: Infromation
},{
path:"/Like",
meta:{
requireAuth: true
},
component:true
},{
path:"/Skill",
meta:{
requireAuth:true
},
component:Skill
}]
}]
})
export default router
Loading Code
< template >
<div id="demo">< button value= "goIndex" @ click= "goIndex" > goIndex < / button >
</div> < / template >
< script >
import Vue from "vue"
export default {
name: "Loading",
data() {
return {
username:""
}},
methods: {
goIndex:function (){
this.$router.push("/")
return {
username:"1"
}
}
}}
< / script >
Layout page
< template >
<div>hellow world</div>< / template >
< style >
div{font-size: 30px;} < / style >
what"s wrong with this and how should I fix it?