Vue JS rc-1通过道具传递数据无效
在Vue 1.0的发行说明中。0-rc。我们被告知
"继承选项已被弃用。总是通过道具向子组件传递数据。"
但是，组件API部分表示
"$data不能再用作道具。"
我一直试图将数据传递给我的根Vue实例的子组件，但没有任何运气。
在版本0.12.*中，如果您想要/需要访问父实例的数据、方法等，只需添加。。。
inherit: true
...到子组件。
现在，在试图通过道具访问父数据时，我继续碰壁。下面是一个简化的例子：
app.js：
new Vue({
el: '#app',
data: {
authorized: false,
currentView: 'welcome-view'
},
components: {
'welcome-view': require('./views/welcome')
}
});
意见/欢迎。js:
module.exports = {
props: ['authorized'],
template: require('./welcome.template.html')
};
意见/欢迎。样板html:
<div v-if="authorized"><p>You Are Logged In</p></div>
<div v-else>Please Log In</div>
主视图文件（app.blade.php）
...
<body id="app">
<component :is="currentView"></component>
</body>
...
“授权”道具根本无法识别。它在组件外部（在“app”id中）正常工作，但不在模板内。
目前，我可以通过在我需要的任何地方使用$root来访问我需要的数据。例如：
<div v-if="$root.authorized"><p>You Are Logged In</p></div>
但是，我的理解是，正如医生所说，这是一种“糟糕的形式”：
尽管可以访问父链中的任何实例，但您应该避免直接依赖子组件中的父数据，而更喜欢使用props显式地向下传递数据。
所以，我需要知道的是。。。如何明确使用道具？我显然是走错了路，因为如果我只是在“props:[]”数组中列出它们，我的子组件就无法使用它们。我错过了什么？
归根结底，重构当前代码以替换“inherit:true”并仍然可以访问根实例数据和函数的最佳方式（标准和实践）是什么？欢迎对此提供任何帮助/建议。提前谢谢。
共有2个答案
我也有同样的问题，没有意识到你也必须像这样将值绑定到组件道具：
v-bind:authorized="authorized"
还是速记
:authorized="authorized"
这里有一个我一直在努力的例子来说明解决方案：http://jsfiddle.net/yyx990803/2uqmj2jj/6/
有关以超文本标记语言访问道具的正确方法，请参阅此页上的@StephenHallgren答案。
至于剩下的部分，（如何正确地重构代码以替换“inherit:true”，我在这里提供了我从Evan Y.在Vue官方论坛上收到的答案，以防将来有人遇到这个问题。
他对上述问题的答复是：
如果你对结构相当确定，你可以使用$root.authorized.
或者，根本不要将授权状态放在根目录中。为用户状态提供一个专用模块，可以在任何组件中导入。看见http://rc.vuejs.org/guide/application.html#State_Management
我从中得到的启示是——如果有具体的全局变量不会改变，并且应用程序结构良好，那么可以使用$root（或$parent，视情况而定），如果元素的状态有时会改变（例如用户是否被授权/登录），那么关键是使用状态管理模块。
同时，在父级和子级之间传递道具时，必须在道具数组中声明道具，然后将它们绑定到HTML中的组件。
例如
app.js：
new Vue({
el: '#app',
data: {
authorized: false,
currentView: 'welcome-view'
},
components: {
'welcome-view': require('./views/welcome')
}
});
意见/欢迎。js:
module.exports = {
props: ['authorized'],
template: require('./welcome.template.html')
}
welcome.template.html：
<div v-if="authorized"><p>You Are Logged In</p></div>
<div v-else>Please Log In</div>
主要超文本标记语言
<body id="app">
<component :is="currentView" v-bind:authorized="authorized"></component>
</body>
（或速记）
<body id="app">
<component :is="currentView" :authorized="authorized"></component>
</body>
-
问题内容： 如何在不暴露URL的情况下将prop与组件一起传递？ 这样吗？我正在使用。 问题答案： 您可以这样传递数据： 这是您可以访问的方式： 该API文档解释了如何通过状态和其他变量重定向/历史道具。 来源：https : //github.com/ReactTraining/react-router/blob/master/packages/react- router/docs/api/Re
-
问题内容： 我只是在 文档中读到以下错误，它将影响渲染时间。如果是这种情况，我该如何重构代码并使用所需的道具来创建动态样式？ 先感谢您。 标签组件 问题答案： 我相信文档在说的是您应该避免在渲染组件中包含样式： 做这个 代替这个 因为发生的是组件的Props更改，所以组件将重新渲染并且样式将重新生成。因此，有必要将其分开。 因此，如果您进一步阅读 基于道具 的 适应 部分，他们将对此进行解释： 之
-
请考虑以下示例： 我希望将值传递到中，作为哑输入组件的道具。然而，它从不重新呈现它。
-
我无法使用反应路由器通过道具。我到现在为止的代码： 错误截图 我正试图访问控制台中的id，就这么简单。 错误仅在我尝试传递道具时显示 源链接：https://reacttraining.com/react-router/web/api/Route/route-props
-
问题内容： 我在https://reactnavigation.org/docs/navigators/drawer中使用DrawerNavigator 。 我有多个正在使用具有不同道具的组件的屏幕。 我该怎么做： 问题答案： 在许多情况下，我认为更好的方法是： 这会将您的导航道具放入props.navigation.state.params中。如果您希望它们出现在this.props中（这意味着
-
我正在使用gradle credentials插件将用户和密码数据库传递给liquibase插件。另外，我使用spring data repositories和hibernate作为数据层，我希望传递给它与liquibase插件相同的配置。有一种通过gradle传递凭据的方法（我不想创建application.properties文件，因为凭据已经存储在凭据插件上）？ 我正在使用以下代码向Liqu
-
我是vue的初学者。我最近开始学习vue。我在vue组件中添加了一个道具。我认为代码似乎是正确的。但发生了一个错误。有人告诉我如何将字符串或数字传递给childComponent，以及如何检查它吗。 应用程序。vue 样品刀身php
-
有什么简单的方法可以实现这一点吗？ 这是我导航到路线的代码 这是我的路由模块 基本上，我希望执行与CreateAlbum组件是当前组件的子组件相同的操作，在这种情况下，我将使用@Input（）