python ipyvuetify关闭浮动对话框（ipywidgets）

我正在使用ipyvutify尝试编写优秀的GUI。 它看起来很棒，但对于从未使用过HTML和CSS的人来说有点难

下面是一个完整的代码，它在单击“打开对话框”按钮时生成一个浮动对话框

我想使用ipyvuetify解除打开和关闭浮动对话框的功能，使用以下代码，即使代码工作正常，我也无法理解它

目标是用一个按钮打开一个对话框，并且在对话框内有一个关闭按钮（与其他按钮一起）

如果你把上面的代码粘贴到你的一个单元格中，你会意识到下面我想理解的奇怪行为

如果在可视化部分中未显示exampledialog，则其他按钮将不起作用。仅当exampledialog是布局子项的一部分时，按钮才起作用。 此外，对话框的按钮在第一次运行时会自动消失

这真是件奇怪的事。 有人能解释一下吗

---

一般的问题是如何通过对话框外的按钮打开和关闭对话框。dialog.value=True似乎真的不起作用

除了第一个按钮的变量名中有一个小的输入错误之外，它看起来完全正确

第一个按钮应该是“v_btn_OPEN”，而不是“v_btn_OTHER”，因为您在对话框中将“OTHER”按钮用作关闭按钮

现在，请回答您的问题：

在可视化部分包含exampledialog的必要性： exampledialog需要添加到[DOM][1]中，否则对于客户端，它们根本不存在。使用ipyvuetify可以通过将元素输出到客户端来完成此操作。仅仅将它们作为python（服务器端）对象是不够的

[1] :https://www.w3.org/TR/WD-DOM/introduction.html#:~：text=已访问%20文档%20对象%20模型%20（DOM，文档%20已被%20访问%20并已被%20操作）

对话框的按钮在第一次运行时会消失：这似乎与ipyvuetify中的当前错误有关，插槽的行为与您的情况相同。 在修复此错误之前，您通过在元素外部对接按钮并通过“on_click_v_btn_OPEN”功能将其链接所使用的解决方案目前是建议的解决方案

import ipyvuetify as v 
lorum_ipsum= 'loren loren'


#oepn dialog:
v_btn_OTHER   = v.Btn(class_='mx-2 light-blue darken-1', children=['OTHER'])
def on_click_v_btn_OPEN (widget, event, data):
    exampledialog.value = True
    pass
v_btn_OPEN.on_event('click', on_click_v_btn_OPEN)

# CLOSE BUTTON INSIDE THE DIALOG
v_btn_CLOSE   = v.Btn(class_='mx-2 light-blue darken-1', children=['CLOSE'])
def on_click_v_btn_CLOSE (widget, event, data):
    exampledialog.value = False
v_btn_CLOSE.on_event('click', on_click_v_btn_CLOSE)

# ACTION BUTTON INSIDE THE DIALOG
v_btn_OTHER   = v.Btn(class_='mx-2 light-blue darken-1', children=['OTHER'])
def on_click_v_btn_OTHER (widget, event, data):
    # code to open facebook.com in a new tab
    pass
v_btn_OTHER.on_event('click', on_click_v_btn_OTHER)

# THE DIALOG
exampledialog = v.Dialog(width='500',
    v_slots=[{
        'name': 'activator',
        'variable': 'x',
        'children': v.Btn(v_on='x.on', color='success', dark=True, children=[
            'OTHER dialog'
        ]),
    }], 
    children=[
        v.Card(children=[
            v.CardTitle(class_='headline gray lighten-2', primary_title=True, children=[
                "Lorem ipsum"
            ]),
            v.CardText(children=[
                lorum_ipsum,
                v.TextField(label='Label', placeholder='Placeholder'),
                v_btn_CLOSE,
                v_btn_OTHER,
            ]),
    ])
])

# VISUALIZATION
display(v.Layout(children=[v_btn_OPEN,exampledialog]))