List of components
#1081
-
I'm confused about what's happening here. Consider this App: from reactpy import component, use_state
from reactpy.html import div, button
from reactpy.core.types import State
@component
def Item(item: str, items: State):
color = use_state(None)
def deleteme(event):
items.set_value(lambda items: [i for i in items if (i != item)])
def colorize(event):
color.set_value(lambda c: "blue" if not c else None)
return div(
{'style': {'background-color': color.value or "transparent", 'padding': "5px"}},
div(
button({'onClick': colorize}, f"Color {item}"),
button({'onClick': deleteme}, f"Delete {item}"),
),
)
@component
def App():
items = use_state(["A", "B", "C"])
return div(
[
Item(item, items, key=item)
for item in items.value
]
) I embed it from a Django template. Here's the equivalent ReactJS implementation for reference. Now, when I delete Item A then click to color Item B, then unexpectedly, Item C appears overwritten. reactpy==1.0.1 |
Beta Was this translation helpful? Give feedback.
Answered by
rmorshea
Jul 4, 2023
Replies: 1 comment 7 replies
-
This might be related to a common issue in Python, since all variables are passed by reference. See this page for more details. You will need to create a wrapper function for your event and pass in |
Beta Was this translation helpful? Give feedback.
7 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Fix is released in https://github.com/reactive-python/reactpy/releases/tag/reactpy-v1.0.2