Vue弹框内嵌路由页面

要在Vue弹框中嵌入路由页面，可以使用Vue Router提供的动态组件功能。具体步骤如下：

1. 在Vue组件中定义一个弹框，可以使用第三方UI库，如ElementUI的Dialog组件。

2. 在弹框中定义一个动态组件，用于渲染路由页面。这个组件可以使用Vue Router提供的<router-view>组件。

3. 在路由配置中定义一个子路由，用于匹配弹框中要显示的页面。

4. 在弹框的打开事件中，通过$router.push()方法将路由切换到子路由，从而加载要显示的页面。

下面是一个简单的示例代码：

<template>
  <el-dialog :visible.sync="dialogVisible">
    <router-view></router-view>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false
    }
  },
  methods: {
    openDialog() {
      this.$router.push('/dialog-page')
      this.dialogVisible = true
    }
  }
}
</script>

// 路由配置
const router = new VueRouter({
  routes: [
    {
      path: '/dialog-page',
      component: DialogPage
    }
  ]
})

在上面的代码中，我们在组件的模板中定义了一个ElementUI的Dialog组件，并在其中使用了<router-view>组件来渲染路由页面。在组件的方法中，我们通过$router.push()方法将路由切换到子路由/dialog-page，并将弹框的可见性设置为true，从而打开弹框。在路由配置中，我们定义了一个子路由/dialog-page，用于匹配要在弹框中显示的页面。