2017-08-09 3 views
1

さまざまな情報セットに対して複数のタブを持つアプリを作成しようとしています。私の最初の考えは、html Buttonsを使用することでしたが、これのためのdash_core_componentはありません。私はその場所で使用できるものについてはドキュメントを見つけることができません。基本的に、ボタン(またはリンク)をクリックすると、ボタンのIDで「クリックされた」イベントを取得したいので、選択したページのレイアウトを再描画できます。クリックイベントを伴う基本ボタンのダッシュコアコンポーネントですか?

既存のコンポーネントでこれを行う方法はありますか?コールバックシステムに接続できる新しいコンポーネントを作成する方法に関するドキュメントはありますか?私は明らかに何かを欠いている必要があるように感じますが、多くの検索の後に何かを見つけることができませんでした。

ありがとうございます!

答えて

0

Aha!最後にここに文書化され、答えが見つかりました:(?インデックス内)https://plot.ly/dash/urls

をより明白な方法でユーザーガイドにこれをリンクするとよいでしょう

1

実際に、彼らはのために利用できるクリックイベントを持っています最新のdash_html_componentsのボタンですが、まだ完全には文書化されていないようです。作成者のchriddypは、Eventオブジェクトが将来保証されない可能性がありますが、Stateはそうでなければならないstatedです。

使用Stateが好き:

@app.callback(
    Output('output', 'children'), 
    [Input('button-2', 'n_clicks')], 
    state=[State('input-1', 'value'), 
    State('input-2', 'value'), 
    State('slider-1', 'value')]) 

あなたは彼らが変更された場合、コールバックを開始せずに、入力として値を使用することができます - 代わりにコールバックをオフに解雇しInput('button', 'n_clicks')を待っています。

import dash 
from dash.dependencies import Input, Output, State 
import dash_html_components as html 
import dash_core_components as dcc 

app = dash.Dash() 

app.layout = html.Div([ 
    html.Button('Click Me', id='button'), 
    html.H3(id='button-clicks'), 

    html.Hr(), 

    html.Label('Input 1'), 
    dcc.Input(id='input-1'), 

    html.Label('Input 2'), 
    dcc.Input(id='input-2'), 

    html.Label('Slider 1'), 
    dcc.Slider(id='slider-1'), 

    html.Button(id='button-2'), 

    html.Div(id='output') 
]) 

@app.callback(
    Output('button-clicks', 'children'), 
    [Input('button', 'n_clicks')]) 
def clicks(n_clicks): 
    return 'Button has been clicked {} times'.format(n_clicks) 

@app.callback(
    Output('output', 'children'), 
    [Input('button-2', 'n_clicks')], 
    state=[State('input-1', 'value'), 
    State('input-2', 'value'), 
    State('slider-1', 'value')]) 
def compute(n_clicks, input1, input2, slider1): 
    return 'A computation based off of {}, {}, and {}'.format(
     input1, input2, slider1 
    ) 

if __name__ == '__main__': 
    app.run_server(debug=True) 
:リンクから以下の完全なコード例をコピー

関連する問題