reacton icon indicating copy to clipboard operation
reacton copied to clipboard

Element keys set with Reacton `.key(...)` are not recognized by the ipyvuetify transition group

Open egormkn opened this issue 1 year ago • 1 comments

Hello! I'm not sure if this issue should be opened in reacton or ipyvuetify repository. When I try to use Vuetify transition groups, I get an error in browser console saying: [Vue warn]: <transition-group> children must be keyed: <v-dialog>

However I used a key method on reacton elements inside the group:

with rv.FadeTransition(group=True):
    if figures.raw_measurements:
        MplFigure(*figures.raw_measurements).key("raw_measurements")
    if figures.field_accuracy:
        MplFigure(*figures.field_accuracy).key("field_accuracy")
    if figures.calibration_moment:
        MplFigure(*figures.calibration_moment).key("calibration_moment")

(MplFigure here is a @reacton.component with rv.Dialog as the root element.) Should the same keys be used by Vue in browser?

egormkn avatar May 23 '24 12:05 egormkn

For now we do not use the same key, and I think ipyvuetify also does not support key.

With a small template, this is relatively easy to support: https://py.cafe/maartenbreddels/solara-transitions

maartenbreddels avatar Dec 16 '24 14:12 maartenbreddels