【发布时间】：2019-01-23 23:42:56
【问题描述】：
我正在设计一个页面，该页面使用一个酒店组件返回一堆不同的酒店。每家酒店都将唯一的值传递给组件，例如名称、星级、酒店设施等。
在 Vue 实例的主页面上，我需要一些基本的过滤器，这些过滤器可以根据每个组件自己的 prop 值切换为真/假。我不知道如何将 prop 值从酒店组件中提取到主 Vue 实例中并在其上运行方法？
由于这是一个小应用程序，我使用 CDN 是为了方便使用。
下面的组件示例。
<hotels
hoteltitle="Ryans"
hoteldesc="This hotel is situated on the popular waterfront with sweeping views
overlooking the marina."
loc="Ibiza"
star="4"
beachfront="true"
family="false"
gym="true"
pool="true"
single="true"
spa ="false"
hotelurl="/url.html"
price="74"
url="index2.html"
accomCode="30030"
></hotels>
【问题讨论】：
-
我认为您不应该将某些东西从子组件拉到父组件。 “所有的 props 在子属性和父属性之间形成一个单向向下的绑定：当父属性更新时，它会向下流向子属性，反之则不会。” vuejs.org/v2/guide/components-props.html#One-Way-Data-Flow。也许考虑使用事件总线。
-
你能显示你的父组件代码吗？
-
@SuiDream 很空！
-
@Matt 可能就是问题所在。您可以将酒店存储在父组件的数组中，过滤计算属性中的数组，并使用过滤后的数组在循环中渲染子项。
标签： vue.js vuejs2 vue-component