我的组件中有一个方法,它添加弹出并将一些道具传递到它的组件中。
openPopup () {
this.$store.dispatch('addPopup', {
component: MapCropsPopup,
props: {
anchor: this.$refs.filter,
selectedCropIds: this.selectedCropIds,
activeSeason: this.activeSeason,
onBeforeClose: () => {
this.$router.push(this.getQuery({ showCrops: null }));
},
onSeasonChange: (season) => {
this.activeSeason = season;
}
}
});
}在这里,在子组件中,我将所有传递的道具存储到“props”变量中。
props: ['props']并在模板中直接使用。
<div class="mcp-seasons__btn"
:class="{ 'm--active': props.activeSeason === 'current' }"
@click="setActiveSeason('current')">
{{ i18n.CURRENT_LABEL }}</div>若要更新父组件中的当前季节,请使用方法setActiveSeason
setActiveSeason (season) {
this.props.onSeasonChange(season);
}它运行良好,并且更新父组件中的“activeSeason”,但不会在子组件中更新相同的属性。
我应该如何使使属性再次反应
发布于 2018-08-01 12:11:29
当你做的时候
selectedCropIds: this.selectedCropIds,
activeSeason: this.activeSeason,您正在使对象的非反应性成员在当时初始化为给定值。如果你做了这样的事
propParent: this在props.propParent.activeSeason引用的弹出组件中,您将使用反应性项。
https://stackoverflow.com/questions/51631917
复制相似问题