Solara•10mo ago

Using use_effect

Hi, I'm wondering if .use_effect is expected for ipyvuetify widgets in a jupyter notebook? Its registering the event but the widget just disappears when it occurs.

16 Replies

CorranOP•10mo ago

My code: def function(): i.value = i.value+1 @solara.component def Test(): i = solara.reactive(0) institution, set_institution = solara.use_state("") institutions, set_institutions = solara.use_state([]) auto = v.Autocomplete( itemText="Description", vModel="Value", label="Institutions", placeholder="Start typing...", filled=True, items=institutions, dense=False, clearable=True, no_filter=True, auto_select_first=True, no_data_text=f"No matches found", ) v.use_event(auto, "update:search-input", function) v.Container( children=[auto] ) Test()

MaartenBreddels•10mo ago

Dear Coran, I don’t know why it disappears, but if you can give me the full code so I can run it, that might help. Also, solara.reactive should be out of the component or you should use use_reactive. I don’t see you using use_effect btw. Also if you use triple backticks you get code formatting like in Markdown

CorranOP•10mo ago

Ah Im very sorry, I was trying to use a few functions this evening, at one point use_effect, but I saw code from someone in this discord trying to do a different thing using use_event and working so I tried it. The use_event function is what I'm trying to get working here

CorranOP•10mo ago

Stefan•10mo ago

just a tip, sharing code as an image makes it hard to copy

Stefan•10mo ago

best way of sharing code is by formatting it like this:

def my_function():
  return

def my_function():
  return

CorranOP•10mo ago

Its the same as this, I just didnt include the imports before.

Stefan•10mo ago

You can edit that message with the formatting

CorranOP•10mo ago

I think its pasted into an IDE the same way

Stefan•10mo ago

CorranOP•10mo ago

Sorry this threads a bit of a mess 😅 . I should have proofread my messages better and like Stefan said, provided the code in a better way. I'm probably missing something obvious so Ill just spend more time with the documentation.

MaartenBreddels•10mo ago

If you can edit your first code or give code that I can copy paste, that would be very helpful

CorranOP•10mo ago

import solara
import reacton.ipyvuetify as v


i = solara.reactive(0)

@solara.component
def AC():
  def function():
      i.value = 1

  institution, set_institution = solara.use_state("")
  institutions, set_institutions = solara.use_state([])

  auto = v.Autocomplete(
        itemText="Description",
        vModel="Value",
        label="Institutions",
        placeholder="Start typing...",
        filled=True,
        items=institutions,
        dense=False,
        clearable=True,
        no_filter=True,
        auto_select_first=True,
        no_data_text=f"No matches found",
        on_value_change=function(),
    )
  v.use_event(auto,"update:search-input",function)

@solara.component
def Page():
  v.Container(
    children=[AC(),solara.Markdown("hi!")]
  )

Page()

import solara
import reacton.ipyvuetify as v


i = solara.reactive(0)

@solara.component
def AC():
  def function():
      i.value = 1

  institution, set_institution = solara.use_state("")
  institutions, set_institutions = solara.use_state([])

  auto = v.Autocomplete(
        itemText="Description",
        vModel="Value",
        label="Institutions",
        placeholder="Start typing...",
        filled=True,
        items=institutions,
        dense=False,
        clearable=True,
        no_filter=True,
        auto_select_first=True,
        no_data_text=f"No matches found",
        on_value_change=function(),
    )
  v.use_event(auto,"update:search-input",function)

@solara.component
def Page():
  v.Container(
    children=[AC(),solara.Markdown("hi!")]
  )

Page()

Also, another noob question 😅 . I'm testing running a multipage app using solara server, I'm trying to define global variables in a py file with variable=solara.reactive(), however this doesn't seem to make them available to pages in other .py files i.e.

#01-page.py
import solara
v = solara.reactive(0)

@solara.component
def Page():
    v.set(1)

#01-page.py
import solara
v = solara.reactive(0)

@solara.component
def Page():
    v.set(1)

#02-page.py
import solara

@solara.component
def Page():
    solara.Markdown(f'{v}')

#02-page.py
import solara

@solara.component
def Page():
    solara.Markdown(f'{v}')

When running solara run . in the Project I get an error like this: File "C:\Users\Corran\Project\02-page.py", line 7, in Page solara.Markdown(f'{v}') ^^ NameError: name 'v' is not defined Sorry, I'm probably misunderstanding the scope of reactive variables

Stefan•10mo ago

that's a basic python thing, global variables don't really exist what you could do is define the variable in a module and then import that module in both pages

CorranOP•10mo ago

Ah I see, makes sense. Looking back at the example, I see they do actually have a data file at the top level which seems to be doing the same thing. Ill define them in a seperate file like this and just import them from there. Thanks for the help and suggestion!

MaartenBreddels•10mo ago

I don't know why you didn;t get an error @Corran , I got TypeError: function() takes 0 positional arguments but 3 were given This is because the event handler should take arguments, if you are not interested in them, add the args, like this: ```python def function(args): i.value = 1 ``` I hope that helps

Gaming

Programming

Using use_effect