破折号回调元素滚动

【问题标题】：Dash callback element scrolling破折号回调元素滚动
【发布时间】：2020-11-09 10:30:09
【问题描述】：

我有一个 Dash 应用程序，我希望元素滚动如下：

<div id="scrollhere"></div>
<a href="#scrollhere"></a>

我想使用回调而不是 <a> 元素。例如：

@app.callback(
    Output('url', 'pathname'),
    [Input('map', 'clickData')]
)
def map_click_callback(clicked):
    if not clicked:
        raise PreventUpdate

    return "#scrollhere"

这可能吗？

【问题讨论】：

标签： python plotly-dash

【解决方案1】：

我遇到了类似的问题，并通过客户端回调解决了它，不完全是这样，但类似于：

app.clientside_callback(
    """
    function(clicks, elemid) {
        document.getElementById(elemid).scrollIntoView({
          behavior: 'smooth'
        });
    }
    """,
    Output('garbage-output-0', 'children'),
    [Input('button-to-scroll', 'n_clicks')],
    [State('target-element', 'id')]
)

garbage-output-0 这里只是因为 Dash 要求你有一些东西作为输出。我很确定一定有更好的方法来做到这一点，例如创建一个执行类似于我发布的 JS 代码的组件，但可以从服务器端调用。

【讨论】：