在我的场景中，我有两个圣科伦和两个文本区域。一个用于用户输入，另一个用于生成的文本。有没有可能扩展每一行的文本区域，并摆脱文本区域中的滚动条？在测试时，我只能使用滚动条，我知道你可以使用st.markdown来插入HTML，但我不知道如何调用文本区域以及如何编辑这些区域来动态调整高度。
z9gpfhce1#
你需要写一个小脚本来完成这项工作。看看这个
const textArea = document.querySelector('.textarea-test') textArea.addEventListener('input',(e)=>{ textArea.style.height = "auto" textArea.style.height = `${textArea.scrollHeight}px`; })
个字符
k75qkfdt2#
import streamlit as st import streamlit.components.v1 as v1 st.set_page_config(page_title="Test Site", layout="wide") col1, col2 = st.columns(2) with col1: userInput = st.text_area("Input:") with col2: generatedText = st.text_area("Output:", key="Output") #Testbox html_string=''' <textarea name="" id="" cols="30" rows="4" class="textarea-test"></textarea> <script> const textArea = document.querySelector(".textarea-test") textArea.addEventListener('input', (e) => { textArea.style.height = "auto" textArea.style.height = `${textArea.scrollHeight}px`; }) </script> ''' v1.html(html_string)
字符串测试盒现在正在工作。现在的问题是识别上面列中由streamlit创建的两个文本区域。脚本已知的文档不知道这两个文本区域。因此，无法通过查询选择器进行选择。
2条答案
按热度按时间z9gpfhce1#
你需要写一个小脚本来完成这项工作。看看这个
个字符
k75qkfdt2#
字符串
测试盒现在正在工作。现在的问题是识别上面列中由streamlit创建的两个文本区域。脚本已知的文档不知道这两个文本区域。因此，无法通过查询选择器进行选择。