将 props 传递给 Vue-router 实例化的 Vue.js 组件

假设我有一个像这样的 Vue.js 组件:

Suppose I have a Vue.js component like this:

var Bar = Vue.extend({
    props: ['my-props'],
    template: '<p>This is bar!</p>'
});

我想在 vue-router 中的某个路由匹配时使用它:

And I want to use it when some route in vue-router is matched like this:

router.map({
    '/bar': {
        component: Bar
    }
});

通常为了将myProps"传递给组件，我会执行以下操作:

Normally in order to pass 'myProps' to the component I would do something like this:

Vue.component('my-bar', Bar);

并在 html 中:

<my-bar my-props="hello!"></my-bar>

在这种情况下，当路由匹配时，路由器会自动在路由器视图元素中绘制组件.

In this case, the router is drawing automatically the component in the router-view element when the route is matched.

我的问题是，在这种情况下，如何将道具传递给组件?

My question is, in this case, how can I pass the the props to the component?