[英]Getting the value of a parent computed function, from a child component in VueJS
I'm trying to pass the value of a computed method which changes, into my child component, with little success.我正在尝试将更改的计算方法的值传递给我的子组件,但收效甚微。 I'm making a button component which has several different save states - yet my button is always stuck on one and doesn't update with the parent.我正在制作一个按钮组件,它有几种不同的保存状态——但我的按钮总是卡在一个上,并且不会与父级一起更新。
My computed method works fine when I'm not trying to use this button as a component and just put it directly into the parent, so the issue is how I'm passing the data.当我不尝试将此按钮用作组件并将其直接放入父级时,我的计算方法工作正常,所以问题是我如何传递数据。
Parent家长
computed: {
isSaving() {
return (
this.$_.values(this.$store.getters["CommonSettings/saving"]).filter(
status => status && status != "done"
).length > 0
);
}
<SaveButton v-bind:saveState="isSaving"/>
Child孩子
<script>
export default {
name: "saveButton",
props: ['saveState']
}
</script>
<template>
<div class="settings--button-wrapper">
<button v-if="!saveState">
Save
</button>
<button v-if="saveState">
Saving..
</button>
</div>
</template>
Am I doing anything which is obviously wrong here?我在这里做任何明显错误的事情吗?
Parent家长
computed: {
isSaving() {
// add `this.`
return (
this.status && this.status != "done"
)
);
}
}
<SaveButton v-bind:saveState="isSaving"/>
Child孩子
<script>
export default {
name: "saveButton",
props: ['saveState']
}
</script>
<template>
<div class="settings--button-wrapper">
<!-- use `saveState` -->
<button>
{{ saveState ? 'Saving..' : 'Save' }}
</button>
</div>
</template>
You should use saveState
instead of isSaving.您应该使用saveState
而不是 isSaving。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.