Question

当前，我的应用程序呈现在同一页面上，但我希望它呈现到新页面上。我尝试使用render: h => h(App)进行渲染，但是仍然在同一页面上渲染。

这是路由器链接到的Vue文件（Risks.vue）：

<router-link to="/risk-info">
<td>{{item.Model}}</td>
<td>{{item.Vulnerability}}</td>
<td>{{item.Unresolved}}</td>
</router-link>
<router-view/>

以下文件将我的路由器链接到组件（index.js）：

import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const routes = [
  {
    path: '/risk-info',
    name: 'RiskInfo',
    component: () => import('../components/breakdown/risks/VulnerabilityDetails.vue')
  }
]

const router = new VueRouter({
  routes
})

export default router

最后，这是定义Vue对象（main.js）的文件：

new Vue({
  router,
  render: h => h(App),
  store,
}).$mount('#app')

Answer 1

如果您的意思是，如何在新标签页中打开链接，则可以在target上使用<router-link>属性

<router-link to="/risk-info" target="_blank">...</router-link>

尽管显然您会丢失任何应用程序状态，因为它将加载您的应用程序的新实例。

如何使用路由器将Vue组件呈现到Vue-js中的另一个（新）页面？

1 个答案: