Query Params + Anchors

Using Streamlit
, ,
1

I am running a multi-page app whereby my users can link to pages using query params.

I built the app before the multi-page tools were rolled out but given my understanding, I think my iteration is palatable given my use of streamlit_authenticator.

At any rate, the problem:

I have linked my query_param with the key ‘page’ to the select box where users can navigate to various pages. This will determine which of the page files to render which allows me to create direct links to pages.

However, if I link to page that includes an anchor, such as “someapp.web/?page=about#teams”, the proper page will load but in doing so it will drop the anchor. If I manually add the #teams to the URL after loading and hit enter it will jump to that location.

It appears that initializing the page is causing me to lose the anchor and since the default is that one does not exist I am unsure how to structure the code to allow for this utility.

Anything obvious that I am missing? I am only a few months into Streamlit and Python for that matter so any help helps!

gist of the code is

import streamlit as st
import streamlit_authenticator as stauth
#additional boiler plate set up code

def main():
    if st.session_state["authentication_status"]:

        def update_params():
            st.query_params.page = st.session_state.pg

       
        pages = ["Welcome", "About", "Products"]

        query_params = st.query_params.to_dict()

        ix = 0
        if 'page' in query_params:
            try:
                ix = pages.index(query_params['page']) 
            except ValueError:
                pass
        
        select_page = st.sidebar.selectbox('Directory', pages,index=ix, key="pg",on_change=update_params)
        
        st.query_params.page = select_page

        pages = {
            "Welcome": lambda: Landing.show(),
            "About": lambda: About.show(),
            "Products": lambda: Products.show()
        }
        
        if select_page in pages:
            
            pages[select_page]()
        authenticator.logout('logout', 'sidebar')
    elif st.session_state["authentication_status"] is False:
        st.error('Username/password is incorrect')
    elif st.session_state["authentication_status"] is None:
        st.warning('Please enter your username and password')

        
if __name__ == "__main__":
    main()
1 Like
2

I have a similar problem too. It would be nice if modifying query parameters did not drop the fragment identifier from the URL