Tutorial streamlit: Bagaimana untuk melaraskan ketinggian kawasan teks secara dinamik?

Question

Dalam senario saya, saya mempunyai dua st.lajur dengan dua kawasan teks. Satu untuk input pengguna dan satu lagi untuk teks yang dijana.

Adakah mungkin untuk membuat kawasan teks berkembang dengan setiap baris dan mengalih keluar bar skrol dalam kawasan teks?

Semasa menguji, saya hanya boleh menggunakan bar skrol dan saya tahu anda boleh menggunakan st.markdown untuk memasukkan HTML, tetapi saya tidak tahu cara memanggil kawasan teks dan cara mengeditnya untuk melaraskan ketinggian secara dinamik.

Answer 1

Anda perlu menulis skrip kecil untuk melakukan kerja itu. Sila lihat kod di bawah:

const textArea = document.querySelector('.textarea-test')

textArea.addEventListener('input',(e)=>{
textArea.style.height = "auto"
  textArea.style.height = `${textArea.scrollHeight}px`;
})

<textarea name="" id="" cols="30" rows="4" class="textarea-test"></textarea>