solved! I didn’t know key in v-for was that critical in the scope and I’ve always used the index as key. In my real project I’ve assigned the uid of the item and it worked like a charm! thanks!

Is there any way to autohide the item in case of a deletion without sliding the item back using the reset() method?

Here’s an example:

https://codepen.io/azapater/pen/YzXJmdo

if you slide it from right to left it executes the reset() method and it hides, but it doesn’t look very mobile friendly because it’s not the standard behaviour you see in other apps.

If you slide it from left to right it just deletes the item but the slot stays shown.

Thanks

@metalsadman That’s absolutely brilliant! Problem solved! Also, I do love the UI idea of showing an alert on the tabs with errors I’m so implementing that. Thanks for that extra tip

Thanks for your reply. I’ll check it out ASAP and let you know.

Cheers

Hi,

I have a window with different q-inputs grouped in tabs by topic (general info, bussiness info etc). Underneath and out of the tabs component, there is a save button, so the user can save the info being the focus on any of the tabs.

Even though I validate each q-input with a rule, I want to validate all the info fullfilled in the method assigned to the event @click of the button. For that, I’m using a $ref for each q-input and accessing the .validate() method build-in the q-inputs. Because the inputs are in different tabs, the q-inputs that are not shown in the active tab return undefined when I call validate()

I’ve been playing around with <keep-alive> to cache the tabs. I’ve tried globally around the q-tab-panels component and also individually on each q-tab-panel but nothing seems to work… Any ideas?

Thanks