Javascript 将布尔值从vue路由器传递到其组件

我是Vuejs的新手。每次用户单击主页路由器链接时，我都会尝试触发转换。我阅读了一些将道具传递到路由组件的文档，但仍然无法使其工作。我测试了转换是否有效。但似乎加载的布尔值没有正确地传递给我的组件

路由器索引.js

   {
      path: '/',
      name: 'Home',
      component: Homepage,
      props: { loaded: true }
  },

主页组件：

<template>
 <transition name='fade'>
    <div  class="rgba-blue-grey-strong container" v-show="loaded">
     <p>Text with transition Every time user access Homepage component</p>
    </div>
 </transition>
</template>
<script>
export default {
     name: "Homepage",
     props:['loaded'],
     data(){
        return{
           loaded: false,
       }
     }
}

每次用户访问主页组件时带有转换的文本

导出默认值{
名称：“主页”，
道具：['loaded']，
数据（）{
返回{
加载：false，
}
}
}

您已经在

道具

和

数据

对象中定义了

加载

。删除

数据

对象中的一个即可

<script>
export default {
  name: "Homepage",
  props:['loaded'],
  data(){
    return {
    }
  }
}
</script>

导出默认值{
名称：“主页”，
道具：['loaded']，
数据（）{
返回{
}
}
}