You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Server Error
TypeError: object null is not iterable (cannot read property Symbol(Symbol.iterator))
This is caused by using an older version of nodejs.
👉 Ensure the latest version of reflex is being used.
👉 Remove the .web and ~/.reflex directories and re-run reflex init.
Hydration failed because the initial UI does not match
Unhandled Runtime Error
Error: Hydration failed because the initial UI does not match what was rendered on the server.
Often caused by incorrect nesting of components
Particularly <p> and <div>, but may also occur with tables.
👉 Ensure there are no nested rx.text or layout components within rx.text.
👉 Ensure that all tables are using rx.thead and rx.tbody to wrap the rx.tr rows.
TypeError: Invalid var passed for prop href, expected type <class 'str'>, got value ${state.my_list.at(i)} of type typing.Any.
Add a type annotation for list Vars
For certain props, reflex validates type correctness of the variable. Expecially when de-referencing lists and dicts, it is important to supply the correct annotation.
TypeError: Could not format prop: {'onSubmit': EventHandler(fn=<function State.submit at 0x105c59a60>)} of type <class 'reflex.style.Style'>
Check the component where the event handler is attached
If a component receives a prop that is not recognized, it assumes that it is a style property. So if the code is attaching an on_submit event handler to a component that does not understand on_submit, it will be treated as a style prop, but an event handler will never be a valid style prop, so this exception is raised.
👉 Ensure on_submit or other event handlers are attached to the appropriate component.
Common Issue
defindex() ->rx.Component:
returnrx.form(
rx.input(id="foo"),
rx.button(
"Submit",
type_="submit",
on_submit=State.submit# NO! button does not handle on_submit
),
)
Instead attach on_submit to the rx.form component:
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
object null is not iterable
This is caused by using an older version of nodejs.
👉 Ensure the latest version of reflex is being used.
👉 Remove the
.web
and~/.reflex
directories and re-runreflex init
.Hydration failed because the initial UI does not match
Often caused by incorrect nesting of components
Particularly
<p>
and<div>
, but may also occur with tables.👉 Ensure there are no nested
rx.text
or layout components withinrx.text
.👉 Ensure that all tables are using
rx.thead
andrx.tbody
to wrap therx.tr
rows.No ❌
Yes ✅
See upstream docs: https://nextjs.org/docs/messages/react-hydration-error
Invalid var passed for prop
Add a type annotation for list Vars
For certain props, reflex validates type correctness of the variable. Expecially when de-referencing lists and dicts, it is important to supply the correct annotation.
👉 Add type annotations to all state Vars.
Could not format prop
Check the component where the event handler is attached
If a component receives a prop that is not recognized, it assumes that it is a style property. So if the code is attaching an
on_submit
event handler to a component that does not understandon_submit
, it will be treated as a style prop, but an event handler will never be a valid style prop, so this exception is raised.👉 Ensure
on_submit
or other event handlers are attached to the appropriate component.Common Issue
Instead attach
on_submit
to therx.form
component:Beta Was this translation helpful? Give feedback.
All reactions