Update sidebar tutorial for new substates ()

This commit is contained in:
Nikhil Rao 2023-12-04 16:49:28 -08:00 committed by GitHub
parent 0bbae2d3d5
commit 19c01492be
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 4 additions and 22 deletions
reflex/.templates/apps/sidebar

View File

@ -27,7 +27,6 @@ This template has the following directory structure:
│   ├── dashboard.py
│   ├── index.py
│   └── settings.py
├── state.py
├── styles.py
├── templates
│   ├── __init__.py
@ -63,11 +62,7 @@ In this template, we have a sidebar component in `{your_app}/components/sidebar.
### Adding State
In this template, we define the base state of the app in `{your_app}/state.py`.
The base state is useful for general app state that is used across multiple pages.
In this template, the base state handles the toggle for the sidebar.
As your app grows, we recommend using [substates](https://reflex.dev/docs/state/substates/)
to organize your state. You can either define substates in their own files, or if the state is
to organize your state.
You can either define substates in their own files, or if the state is
specific to a page, you can define it in the page file itself.

View File

@ -1,7 +1,6 @@
"""Sidebar component for the app."""
from code import styles
from code.state import State
import reflex as rx
@ -76,8 +75,8 @@ def sidebar_item(text: str, icon: str, url: str) -> rx.Component:
rx.Component: The sidebar item component.
"""
# Whether the item is active.
active = (State.router.page.path == f"/{text.lower()}") | (
(State.router.page.path == "/") & text == "Home"
active = (rx.State.router.page.path == f"/{text.lower()}") | (
(rx.State.router.page.path == "/") & text == "Home"
)
return rx.link(

View File

@ -1,12 +0,0 @@
"""Base state for the app."""
import reflex as rx
class State(rx.State):
"""Base state for the app.
The base state is used to store general vars used throughout the app.
"""
pass