streamlitでサイトを作ろうとしましたが、文字列がうまく表示されませんでした。

実現したいこと

文字列を記入してもらい、関数を通した結果を表示するサイトをstreamlitで作りたい。

前提

自分の端末で実行すると、サイトは立ち上がり、インプットとその下の文字数判断までは動きました。
次の文字列を合体させるボタンを押すと、結合した文字列の結果がブラウザに表示されず、ぞの前の
文字列、前3文字、後ろ2文字　も消えてしまいます。

発生している問題・エラーメッセージ

エラーは特に発生していません。

該当のソースコード

import streamlit as st

def merge_strings(string1, string2):
    return string1 * 2 + string2 * 2

# テキスト入力と入力ボタンの作成
user_input = st.text_input("テキストを入力してください")

if st.button("入力"):
    # 文字数が5文字かどうかの判定
    if len(user_input) == 5:
        # 文字列を前3文字と後ろ2文字に分割して表示
        st.write(f"文字列: {user_input}")
        st.write(f"前3文字: {user_input[:3]}")
        st.write(f"後ろ2文字: {user_input[-2:]}")
        
        # ボタンの作成
        if st.button("文字列を合体させる"):
            # 合体させた文字列を表示
            merged_string = merge_strings(user_input[:3], user_input[-2:])
            st.write(f"合体させた文字列: {merged_string}")
    else:
        # 入力が間違っている旨を表示
        st.write("入力が間違っています。文字数が5文字であることを確認してください。")

試したこと

ボタンの作成　if st.button("文字列を合体させる")　を
if st.button("入力")　の外に出すと、userinputがないとエラーがでたので諦めました。

if st.button("文字列を合体させる")にelse: pass を付けましたが、症状が改善しませんでした。　

補足情報（FW/ツールのバージョンなど）

streamlitのVerは4.2.2です。

行動規範の内容に同意します

回答1件

ベストアンサー

セッション管理に関するドキュメント( Add statefulness to apps - Streamlit Docs ) を参考にして、以下の様に書き換えてみました。

python
1import streamlit as st
2
3def merge_strings(string1, string2):
4    return string1 * 2 + string2 * 2
5
6# テキスト入力と入力ボタンの作成
7user_input = st.text_input("テキストを入力してください")
8
9if st.button("入力"):
10    # 文字数が5文字かどうかの判定
11    if len(user_input) == 5:
12        # 文字列を前3文字と後ろ2文字に分割して表示
13        st.write(f"文字列: {user_input}")
14        st.write(f"前3文字: {user_input[:3]}")
15        st.write(f"後ろ2文字: {user_input[-2:]}")
16        st.session_state['input'] = True
17    else:
18        # 入力が間違っている旨を表示
19        st.write("入力が間違っています。文字数が5文字であることを確認してください。")
20        st.session_state['input'] = False
21
22if 'input' in st.session_state.keys() and st.session_state['input']:
23    # ボタンの作成
24    merge = st.empty()
25    if merge.button("文字列を合体させる"):
26        # 合体させた文字列を表示
27        merged_string = merge_strings(user_input[:3], user_input[-2:])
28        st.write(f"合体させた文字列: {merged_string}")
29        merge.empty()
30        st.session_state['input'] = False