Javascript Vuejs，如何将道具传递给路由器渲染的组件？

我是Vuejs的新手，很抱歉这是个新手问题

我已经在我的应用程序中添加了一个路由器，我想将我的主应用程序中的数据呈现到我的组件模板中，但它不起作用

这就是我所拥有的：

Vue.use(VueRouter);

const Text = { props: ['text'], template: '<div>This is the text: {{text}} </div>' }

const routes = [
  { path: '*', component: Text, props: true }
]

const router = new VueRouter({
  routes: routes
})

new Vue({
  router: router,
  el: "#app",
  data: {
    text: "Hello there!"
  }
})

Vue.use（VueRouter）；
const Text={props:['Text']，template:'这是文本：{{{Text}}}
常数路由=[
{path:'*'，component:Text，props:true}
]
常量路由器=新的VueRouter({
路线：路线
})
新Vue({
路由器:路由器,，
el:“应用程序”，
数据：{
文字：“你好！”
}
})

我希望

text

道具链接到我的

App.data.text

，但它没有发生

---

这是一个JSIDLE:

您可能希望通过转发道具（此处将

text

传递给呈现组件

text

）

---

您可能希望通过转发道具（此处将

文本

传递到渲染组件

文本

）

const Text={
道具：[“文本”]，
模板：“这是文本：{{text}}”
};
常量路由=[{path:*”，组件：Text}]；
常量路由器=新的VueRouter({
路线：路线
});
新Vue({
路由器:路由器,，
el:“应用程序”，
数据：{
文字：“你好！”
}
});


const Text={
道具：[“文本”]，
模板：“这是文本：{{text}}”
};
常量路由=[{path:*”，组件：Text}]；
常量路由器=新的VueRouter({
路线：路线
});
新Vue({
路由器:路由器,，
el:“应用程序”，
数据：{
文字：“你好！”
}
});


<router-view :text="text"></router-view>