Generate multi callback through custom component

Hi there

I have some problem implement some component, especially about callback function.

As you know, We approach callback function through ID value. It`s unique value on one page.

I` am not expert for using dash (I still make effort to improve my knowledge about dash on myself)

I am working create component and basic concept is below

page.py

import component

~~~

layout = html.Div([
               component.get_layout('1'),
               component.get_layout('2')
                           ])

component.py

from dash.dependencies import Input, Output
~~~

def get_layout(val):
    return html.Div([
                    html.Div(["id"=val]),
                    dcc.Interval(id='interval_{}'.format(val),
                    interval=1000,
                    n_intervals=0
                    )
               ])

@app.callback([Output(val, 'children')],
              [Input('interval_{}'.format(val), n_intervals)])
def callback_acting(n_interval):
      ~~acting
      return ret

easily to say, I want to create callback that routine is same but target(id) is different, whenever I call new component

of course, If I write new callback function when i add new contents like this

@app.callback([Output(1, 'children')],
              [Input('interval_1', n_intervals)])
def callback_acting_1(n_interval):
      ~~acting
      return ret

@app.callback([Output(2, 'children')],
              [Input('interval_2', n_intervals)])
def callback_acting_2(n_interval):
      ~~acting
      return ret

.
.
.

Obviously, It`s inefficient coding. So I have tried to find something nice way, But I have no idea, what i to do

please share to me your idea Thank you.

Hi!

You might be able to do that through a loop, e.g., in component.py:

for target in target_ids:
    @app.callback([Output(target_id, 'children')],
                          [Input('interval_{}'.format(target_id), n_intervals)])
    def callback_acting(n_interval):
        # ...
        return ret 

Let me know if that’s what you’re looking for!