streamlit 中的条件渲染
Conditional rendering in streamlit
我有一个表单需要使用一些条件渲染。基本上,表单需要根据用户输入的内容动态更改。例如,如果我问“你从哪里听说我们的?”并为用户提供一些默认选项(例如“Linkedin”、“我们的网站”..),我希望如果用户选择“其他”,则会出现 st.text_input,用户可以在其中输入问题的答案。
我面临的问题是:
- 如果我使用 st.form(与 st.submit_form_button),会发生的情况是表单不会动态适应用户的输入。因此,当用户在上面的示例中勾选“其他”时,text_field 根本不会显示。
- 如果我不使用 st.form,则每次用户单击任何小部件时都会重新加载表单。这不会影响表单的功能,但会造成非常糟糕的用户体验!
关于如何在 st.form 中包含条件呈现或只是避免每次用户单击任何小部件时重新加载表单的糟糕用户体验的任何提示?
如有任何帮助,我们将不胜感激!
不使用表单,您可以手动创建表单并创建多个容器来分隔代码。
import streamlit as st
########################################################
# Sidebar section
########################################################
sb = st.sidebar # defining the sidebar
sb.markdown("️ **Navigation**")
page_names = [" Home", "⚙️ Other"]
page = sb.radio("", page_names, index=0)
if page == " Home":
st.subheader("Example home")
st.subheader("What is Lorem Ipsum? ?")
lorem_ipsum = "Lorem Ipsum is simply dummy text of the printing and typesetting industry"\
"Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book"
st.markdown(lorem_ipsum, unsafe_allow_html=True)
else:
other_title = '<h3 style="margin-bottom:0; padding: 0.5rem 0px 1rem;">⚙️ Other</h3>'
st.markdown(other_title, unsafe_allow_html=True)
lorem_ipsum = "Lorem Ipsum is simply dummy text of the printing and typesetting industry"\
"Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book"
st.markdown(lorem_ipsum, unsafe_allow_html=True)
container_selection = st.container()
col1_cs, col2_cs = container_selection.columns([1, 2])
with col1_cs:
slider_val = st.slider("Form slider")
see_text = st.checkbox("See text")
if see_text:
st.warning("**See text** will take more time. Are you sure ?")
other = st.checkbox("Other")
if other:
st.info("Other checkbox")
result = st.button(label="other buttom")
with col2_cs:
st.caption(" ")
if result:
ccp = st.container()
with ccp:
information_title = '<h3 style="margin-bottom:0; padding: 0.5rem 0px 1rem;"> Ipsum is simply dummy text </h3>'
st.markdown(information_title, unsafe_allow_html=True)
我有一个表单需要使用一些条件渲染。基本上,表单需要根据用户输入的内容动态更改。例如,如果我问“你从哪里听说我们的?”并为用户提供一些默认选项(例如“Linkedin”、“我们的网站”..),我希望如果用户选择“其他”,则会出现 st.text_input,用户可以在其中输入问题的答案。
我面临的问题是:
- 如果我使用 st.form(与 st.submit_form_button),会发生的情况是表单不会动态适应用户的输入。因此,当用户在上面的示例中勾选“其他”时,text_field 根本不会显示。
- 如果我不使用 st.form,则每次用户单击任何小部件时都会重新加载表单。这不会影响表单的功能,但会造成非常糟糕的用户体验!
关于如何在 st.form 中包含条件呈现或只是避免每次用户单击任何小部件时重新加载表单的糟糕用户体验的任何提示?
如有任何帮助,我们将不胜感激!
不使用表单,您可以手动创建表单并创建多个容器来分隔代码。
import streamlit as st
########################################################
# Sidebar section
########################################################
sb = st.sidebar # defining the sidebar
sb.markdown("️ **Navigation**")
page_names = [" Home", "⚙️ Other"]
page = sb.radio("", page_names, index=0)
if page == " Home":
st.subheader("Example home")
st.subheader("What is Lorem Ipsum? ?")
lorem_ipsum = "Lorem Ipsum is simply dummy text of the printing and typesetting industry"\
"Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book"
st.markdown(lorem_ipsum, unsafe_allow_html=True)
else:
other_title = '<h3 style="margin-bottom:0; padding: 0.5rem 0px 1rem;">⚙️ Other</h3>'
st.markdown(other_title, unsafe_allow_html=True)
lorem_ipsum = "Lorem Ipsum is simply dummy text of the printing and typesetting industry"\
"Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book"
st.markdown(lorem_ipsum, unsafe_allow_html=True)
container_selection = st.container()
col1_cs, col2_cs = container_selection.columns([1, 2])
with col1_cs:
slider_val = st.slider("Form slider")
see_text = st.checkbox("See text")
if see_text:
st.warning("**See text** will take more time. Are you sure ?")
other = st.checkbox("Other")
if other:
st.info("Other checkbox")
result = st.button(label="other buttom")
with col2_cs:
st.caption(" ")
if result:
ccp = st.container()
with ccp:
information_title = '<h3 style="margin-bottom:0; padding: 0.5rem 0px 1rem;"> Ipsum is simply dummy text </h3>'
st.markdown(information_title, unsafe_allow_html=True)