ipyvuetify can't set prop to static text

111 Views Asked by At

Hello nice people of Internet ;)

New job, new language. I need to modify Ipyvuetify Vue code in Jupiter notebooks to use static props.

I was able to throw together simple vue example
where I am able to set prop of child component via assigned static text in declarative way in vue file. And it works just fine in js variant. https://jsfiddle.net/wu9bxL1n/1/

But the same approach doesn't seem to work at all in ipyvuetify syntax. No error no nothing. Static string assigned to child prop is just being silently ignored and I can't seem to find anything in docs as for why. What did I missed ?

Here is the smallest possible code in ipyvuetify syntax copy/pastable to Jupiter notebook.

import ipyvuetify as v
import traitlets
​
class AA(v.VuetifyTemplate):
    template = traitlets.Unicode('''
    <template>
        <v-card-title>{{label}}</v-card-title>
    </template>
    <script> export default { name: "aa", props: ['label'] } </script>''').tag(sync=True)
    
    label = traitlets.Unicode('But this is showing default text instead').tag(sync=True)
​
class BB(v.VuetifyTemplate):
    template = traitlets.Unicode('''
    <template>
    <div>
      <v-text-field label="This text was set statically" ></v-text-field>
      <aa           label="This text was set statically"></aa>
    </div>
    </template>''').tag(sync=True)
   
    components = traitlets.Dict(default_value={'aa': AA()}).tag(sync=True, **v.VuetifyTemplate.class_component_serialization)
​
BB()

​---

Output:

This text was set statically
But this is showing default text instead
1

There are 1 best solutions below

0
On

O boy.

Answer was some undocumented behavior seen in some 3rd party lib source code.

we need to use

default_value={'aa': AA }

instead of

default_value={'aa': AA()}

then setting static props to your own components will work. Weird I know.

Hopefully people solving the some problem will find this. Take care guys ;)