[英]How to "hide/show" the "Expandable Item" component (quasar) from another component
我希望能够隐藏/显示有问题的组件,但来自另一个组件
就像是
-dropdown.Vue
<q-expansion-item
expand-separator
icon="perm_identity"
label="Account settings"
caption="John Doe"
>
<q-card>
<q-card-section>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quidem, eius reprehenderit eos corrupti
commodi magni quaerat ex numquam, dolorum officiis modi facere maiores architecto suscipit iste
eveniet doloribus ullam aliquid.
</q-card-section>
</q-card>
</q-expansion-item>
关闭Drop.Vue
<script>
methods: {
click() {
expansion-item.hide
}
}
</script>
考虑到组件中已经有 @hide 和 @show 方法,但我无法完全从 vuex 管理它!
只需按照https://quasar.dev/vue-components/expansion-item#Controlling-expansion-state 中的说明设置v-model
:
<q-expansion-item
v-model="expanded"
icon="perm_identity"
label="Account settings"
caption="John Doe"
>
并在您的脚本中为您的数据添加一个expanded
变量:
export default {
data: () => ({
expanded: false
})
}
您现在可以通过简单修改的值切换扩张状态expanded
:
this.expanded = true
我使用 ref 属性制作它,并用“this.$refs.expandableItem.hide()
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.