React side of custom component does not receive default value
See original GitHub issueSummary
When I build a custom component I can specify a default value in the python code. I need to specify a default value in the React component again, and they don’t need to have the same value. This can/will lead to unexpected behaviour when they are not aligned.
Steps to reproduce
- Check out the example custom component
- Change
component_value = _component_func(name=name, key=key, default=0)
tocomponent_value = _component_func(name=name, key=key, default=5)
- Click the button
Expected behavior:
I expect to be able to set the initial value in the react component
Actual behavior:
There is no alignment possible between python part of the component and the react side. Only way to solve this is to hard code it at two places.
Is this a regression?
no
Debug info
- Streamlit version: 0.63.0
- Python version: 3.7.6
- Using Conda? pip
- OS version: osx
- Browser version: chrome 83.0
Additional information
If needed, add any other context about the problem here. For example, did this bug come from https://discuss.streamlit.io or another site? Link the original source here!
Issue Analytics
- State:
- Created 3 years ago
- Comments:6 (4 by maintainers)
Top Results From Across the Web
React component's defaultValue does not work - Stack Overflow
I'm trying to use a fetched value from DB as a default value (shown until the component is clicked) of an input field....
Read more >Uncontrolled Components - React
Default Values Changing the value of defaultValue attribute after a component has mounted will not cause any update of the value in...
Read more >Typing React Context to avoid an undefined default value
The custom hook. The custom hook will take care of handling the sidebar state and will return the current state and the setState...
Read more >React useState does not seem to accept a default value here?
To fix this you'll need to avoid mounting the component until the desired default value is available. Alternatively you could probably do something...
Read more >The Guide to Learning React Hooks (Examples & Tutorials)
The side-by-side below shows how the component has lost a little weight. We not only save about five lines of code, but the...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Hey @koenvo - yeah, the default value is not currently passed to the frontend. (Nor is the
key
.) This is on the list of things to do, but it didn’t get in for the launch.Yep - this was added in https://github.com/streamlit/streamlit/pull/2405. I’ll close now!