如何在模式下打开vue-router

Question

我一直在尝试让路由器视图工作在一个模式(如twitter )。有人能帮上忙吗？

这可能是一种实现这一目标的方法，但我不确定这是否正确

​

const Foo = { template: '<div>foo</div>' }
const Bar = { template: '<div>bar</div>' }

const router = new VueRouter({
  mode: 'history',
  routes: [
    {
      path: '/other',
      components: {
        default: Foo,
        modal: Bar,
      }
    }
  ]
})

new Vue({
	router,
  el: '#app'
})

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>

<div id="app">
  <h1>Named Views</h1>
  <ul>
    <li>
      <router-link to="/">/</router-link>
    </li>
    <li>
      <router-link to="/other">/other</router-link>
    </li>
  </ul>
  <router-view class="view one"></router-view>
  <router-view class="view two" name="modal"></router-view>
</div>

​

如何使用模式路由器-视图在模式中打开？

Answer 1

您可以做的是将Bar定义为一个开放模式。这样，当您导航到other时，模式会显示出来，而当您导航离开时，它会隐藏起来。