vue大屏跳转不打开新页面

Vue大屏跳转不打开新页面，可以使用Vue Router中的编程式导航实现。具体步骤如下：

1. 首先，在Vue组件中引入Vue Router：

import router from '@/router'

2. 在Vue组件的方法中，使用编程式导航实现跳转：

this.$router.push('/path')

其中，'/path'是你要跳转的路径。

3. 如果不想打开新页面，可以使用Vue Router提供的replace方法：

this.$router.replace('/path')

这样就可以在当前页面进行跳转，而不会打开新页面。

注意：如果你的Vue组件没有引入Vue Router，可以在Vue实例中全局引入：

import router from '@/router'

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

相关问题

vue中系统后台要求点击【可视化大屏】按钮，需要打开新窗口并调用已写好的的页面组件，但不能影响原窗口显示系统页面

在Vue中打开新窗口可以使用`window.open()`方法，同时使用`target="_blank"`属性确保在新窗口打开链接。

在Vue中调用组件可以使用Vue Router，在路由配置中定义对应的组件，并使用`router-link`或`router.push()`跳转。

综合以上两点，可以实现点击按钮打开新窗口并调用指定组件的效果：

<!-- 在模板中定义按钮 -->
<button @click="openDashboard">可视化大屏</button>

<!-- 在methods中定义打开新窗口的方法 -->
methods: {
  openDashboard() {
    // 打开新窗口
    const newWindow = window.open('', '_blank')

    // 在新窗口中加载指定路由对应的组件
    newWindow.location.href = `/dashboard`
  }
}

需要注意的是，由于在新窗口中加载组件需要重新加载Vue实例，因此在组件中无法直接获取到原窗口中的数据和状态。如果需要在新窗口中展示特定的数据，可以通过URL参数或者其他方法传递需要的数据。