通过路由器发送财产不起作用

Question

我不确定我这样做是否正确，这是我的路由器视图定义：

{
  path: '/page',
  name: 'page',
  component: Page,
  props: true,
  meta: { requiresAuth: true}
},

然后我像这样访问视图：

self.$router.push({ name: 'page', params: {stuff: true }})

这是我的页面组件：

<template>
  <div class="page">
    {{ stuff }}
  </div>
</template>

<script>


export default {
  name: 'Page',
  data() {
    return {
      stuff: false
    }
  },
}
</script>

看起来stuff 属性没有设置为true，它总是false

Answer 1

我们的代码会将stuff 作为组件道具传递，而不是组件的数据

<template>
  <div class="page">
    {{ stuff }}
  </div>
</template>

<script>


export default {
  name: 'Page',
  props: ['stuff']
}
</script>

在document:

当props 设置为true 时，route.params 将设置为 组件道具