Vuetify:如何拥有多个对话内时间选择器组件?

我想要多个 Vuetify 时间选择器来表示事件的开始和结束时间。单独操作,我能够让时间选择器工作。但是,当两个或多个时间选择器并排放置时,组件就会损坏。即使输入行上的值更改,也无法退出第一次选择器对话框。

这是我工作的代码笔链接:'''https://codepen.io/hicario/pen/BaKydjr'''

这是文档:https ://vuetifyjs.com/en/components/time-pickers/

我唯一的猜测是 $refs.dialog.save() 需要一个方法调用,但我仍然是 Vue/Vuetify 的初学者,所以我不太确定。


守着星空守着你
浏览 139回答 2
2回答

神不在的星期二

我假设您正在处理多个 refs 问题。确保 ref 值是唯一的。例如,<component ref="dialog1"> </component><component ref="dialog2"> </component><script>&nbsp;&nbsp;// somewhere in your logic&nbsp;this.$refs.dialog1.save();&nbsp;this.$refs.dialog1.save();</script>&nbsp;

翻过高山走不出你

您的模板中有引用错误<v-dialog ref="dialog1" v-model="modal1" :return-value.sync="time" persistent width="290px">添加了参考对话框 1<v-btn text color="primary" @click="$refs.dialog1.save(time)">OK</v-btn>更新了对 dialog1 的引用示例:https ://codepen.io/vishnubhadoriya/pen/MWyYEee
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript