0

我从 Quasar 复制了一些 HTML 用于带有抽屉的页面布局，但无法弄清楚如何切换抽屉（侧边栏）。该按钮用于隐藏抽屉，但无法再次显示。或者，如果您有一个示例或可以向我指出以类似方式工作的非 Quasar 侧边栏的方向，那将很有帮助。

def show_drawer(self,msg):
    self.wbDrawer.show = True

def toggle_show_drawer(self, msg):
    self.wbDrawer.show = not self.wbDrawer.show

def toggle_visible_drawer(self, msg):
    if self.wbDrawerDiv.visibility_state == 'visible':
        self.wbDrawerDiv.set_class('invisible')
        self.wbDrawerDiv.visibility_state = 'invisible'
    else:
        self.wbDrawerDiv.set_class('visible')
        self.wbDrawerDiv.visibility_state = 'visible'


        self.btn1.visibility_state = 'visible'

def quasar_print():
    wp = jp.QuasarPage()
    c = jp.parse_html(html_string, a=wp)
    for i in c.commands:
        print(i)
    return wp

def quasar_page():
    wp = jp.QuasarPage()
    wp.data["drawer"] = "open"
    root = jp.Div(a=wp)

    c1 = jp.Div(classes='q-pa-md', a=root)
    wbLayout = jp.QLayout(view='hHh Lpr lff', container=True, style='height: 300px', classes='shadow-2 rounded-borders', a=c1)
    wbHeader = jp.QHeader(elevated=True, classes='bg-black', a=wbLayout)
    wbToolbar = jp.QToolbar(a=wbHeader)
    wbToolbarBtn = jp.QBtn(flat=True, round=True, dense=True, icon='menu', a=wbToolbar,click=toggle_visible_drawer)
    wbToolbarTitle = jp.QToolbarTitle(a=wbToolbar, text='Header')
    wbDrawerDiv = jp.Div(a=wbLayout)
    wbDrawer = jp.QDrawer(  width=200, breakpoint=500, bordered=True, classes='bg-grey-3', a=wbDrawerDiv, model=[wp, 'drawer'])     
    wbScrollArea = jp.QScrollArea(classes='fit', a=wbDrawer)
    c9 = jp.QList(a=wbScrollArea)
    c10 = jp.Div(a=c9, text='scroll area')
    btn1 = jp.Button(text='Hide me', a=wbScrollArea)

    wbPageContainer = jp.QPageContainer(a=wbLayout)
    wbPage = jp.QPage(padding=True, a=wbPageContainer)
    pageText = jp.Div(a=wbPage, text='page container')


    btnSideBar = jp.Button(text="button on SideBar", a=wbScrollArea)
    
    # try both visible and show
    btnVisible = jp.QBtn(text="toggle_visible_drawer", a=wbPage,click=toggle_visible_drawer)
    btnShow = jp.QBtn(text="toggle_visible_drawer",  a=wbPage,click=toggle_show_drawer)

    return wp

jp.justpy(quasar_page)
4

0 回答 0