为什么 Vue Router 在我单击 link 之后才加载并重新加载所有网页
Why Vue Router not loading until i click link and reloads all webpage afterwards
我有一个 components.js 满 Vue.component 个实例。
然后我得到一个 main.js，我有一个路由器，我正在使用这些组件来创建不同的页面。
在 index.html 我有 link 到路由器页面。
问题是第一个页面加载时没有加载模板。
如果我点击主页 link，什么也不会发生。但是，如果我单击“关于”或“项目”，页面将完全重新加载。 （得到一个带提示的 iframe，它再次显示。）
然后，点击关于或项目后一切正常。
我试过在新标签页中手动打开 example.com/#/ 但还是一样。
main.js 就像：
const About = { template: '<div>About</div>' }
const Home = { template: `
<web-header></web-header>
` }
const Project = { template: '<div>Project</div>' }
const routes = [
{ path: '/', component: Home },
{ path: '/about', component: About },
{ path: '/projects', component: Project }
]
const router = new VueRouter({
routes: routes
})
const app = new Vue({
router
}).$mount("#app");
终于找到问题的根源了。使用前未加载的组件。
解决方法：
在使用它们之前添加组件文件。
估价：
我习惯于在正文结束标记之前添加所有脚本。
在这种情况下，您必须在 head 结束标记之前添加组件全局实例文件。
（因为 html 如果您之前不加载组件实例，kebab sintax 将无法正常工作）
现在一切正常。
在这里，您获得了查看我所做更改的承诺。
（只需移动标签）
我有一个 components.js 满 Vue.component 个实例。
然后我得到一个 main.js，我有一个路由器，我正在使用这些组件来创建不同的页面。
在 index.html 我有 link 到路由器页面。
问题是第一个页面加载时没有加载模板。 如果我点击主页 link，什么也不会发生。但是，如果我单击“关于”或“项目”，页面将完全重新加载。 （得到一个带提示的 iframe，它再次显示。） 然后，点击关于或项目后一切正常。
我试过在新标签页中手动打开 example.com/#/ 但还是一样。
main.js 就像：
const About = { template: '<div>About</div>' }
const Home = { template: `
<web-header></web-header>
` }
const Project = { template: '<div>Project</div>' }
const routes = [
{ path: '/', component: Home },
{ path: '/about', component: About },
{ path: '/projects', component: Project }
]
const router = new VueRouter({
routes: routes
})
const app = new Vue({
router
}).$mount("#app");
终于找到问题的根源了。使用前未加载的组件。
解决方法： 在使用它们之前添加组件文件。
估价： 我习惯于在正文结束标记之前添加所有脚本。
在这种情况下，您必须在 head 结束标记之前添加组件全局实例文件。 （因为 html 如果您之前不加载组件实例，kebab sintax 将无法正常工作）
现在一切正常。 在这里，您获得了查看我所做更改的承诺。 （只需移动标签）