无法附加到 div 子组件中 [英] Unable to append in the div children component
问题描述
我有多个相互依赖的下拉列表.它们将具有相同的值列表.但是如果我从下拉列表中的任何一个中选择值，那么其他下拉列表就不能采用该值.所以这部分正在起作用.
I am having multiple dropdown which are dependent on each other. They will have the same list of values. But If I choose values from anyone of the dropdown then others dropdown can't take that value. So this part is working.
让我印象深刻的部分是:
我有三个下拉菜单.如果我从第一个下拉列表中选择，那么它会为每个选定的值附加一个范围滑块.
I have three dropdowns. If I select from the 1st dropdown then it will append a range slider for each selected values.
如果从第二个下拉列表开始，它将为每个选定的值附加一个日期选择器第三个下拉列表将用于文本框.
If from 2nd dropdown then it will append a datepicker for each selected values 3rd dropdown will be for the text box.
这部分children.append(slider_comp)给了我错误:
Callback error updating {"index":"num","type":"dynamic-output"}.children
Traceback (most recent call last):
File "/media/kriti/Data_Drive/flask_app/flask_page/annot_app/t4.py", line 136, in display_output
children.append(slider_comp)
AttributeError: 'str' object has no attribute 'append'
我知道这个值是 none 这就是为什么它会给出错误但是如何解决它?
I know this value is none that's why it is giving an error But how to resolve it?
代码:
# -*- coding: utf-8 -*-
import dash
from dash.dependencies import Input, Output
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State, ALL, MATCH
app = dash.Dash(__name__)
# all_options = {
# 'America': ['New York City', 'San Francisco', 'Cincinnati'],
# 'Canada': [u'Montréal', 'Toronto', 'Ottawa']
# }
all_options = [i for i in range(10)]
app.layout = html.Div([
dcc.Dropdown(
id={'type':'dropdown', 'index':'num'},
options=[{'label': k, 'value': k} for k in all_options],
value=[],
multi=True
),
html.Div(
id={
'type': 'dynamic-output',
'index': 'num'
},
children =['a']
),
html.Hr(),
dcc.Dropdown(
id={'type':'dropdown', 'index':'date'},
options=[{'label': k, 'value': k} for k in all_options],
value=[],
multi=True
),
html.Div(
id={
'type': 'dynamic-output',
'index': 'date'
},
children =['b']
),
html.Hr(),
dcc.Dropdown(
id={'type':'dropdown', 'index':'text'},
options=[{'label': k, 'value': k} for k in all_options],
value=[],
multi=True
),
html.Div(
id={
'type': 'dynamic-output',
'index': 'text'
},
children =['c']
),
html.Div(id='display-selected-values')
])
# def set_options(values1, values2):
# print(values1, values2)
# col = ['date', 'num', 'text']
# for i in range(3):
# app.callback(
# dash.dependencies.Output(f'{col[i%3]}-dropdown', 'options'),
# [dash.dependencies.Input(f'{col[(i+1)%3]}-dropdown', 'value'), dash.dependencies.Input(f'{col[(i+2)%3]}-dropdown', 'value')])(set_options)
@app.callback(
dash.dependencies.Output({'type':'dropdown', 'index':'date'}, 'options'),
[dash.dependencies.Input({'type':'dropdown', 'index':'num'}, 'value'), dash.dependencies.Input({'type':'dropdown', 'index':'text'}, 'value')])
def set_date_options(values_num, values_text):
values = values_num + values_text
return [{'label': i, 'value': i} for i in [e for e in all_options if e not in values]]
@app.callback(
dash.dependencies.Output({'type':'dropdown', 'index':'num'}, 'options'),
[dash.dependencies.Input({'type':'dropdown', 'index':'date'}, 'value'), dash.dependencies.Input({'type':'dropdown', 'index':'text'}, 'value')])
def set_num_options(values_date, values_text):
values = values_date + values_text
return [{'label': i, 'value': i} for i in [e for e in all_options if e not in values]]
@app.callback(
dash.dependencies.Output({'type':'dropdown', 'index':'text'}, 'options'),
[dash.dependencies.Input({'type':'dropdown', 'index':'num'}, 'value'), dash.dependencies.Input({'type':'dropdown', 'index':'date'}, 'value')])
def set_num_options(values_num, values_date):
values = values_num + values_date
return [{'label': i, 'value': i} for i in [e for e in all_options if e not in values]]
@app.callback(
dash.dependencies.Output('display-selected-values', 'children'),
[dash.dependencies.Input({'type':'dropdown', 'index':'num'}, 'value'),
dash.dependencies.Input({'type':'dropdown', 'index':'date'}, 'value'),
dash.dependencies.Input({'type':'dropdown', 'index':'text'}, 'value')])
def set_display_children(value_num, value_date, value_text):
return u'{} is a city in {} {}'.format(
value_num, value_date, value_text,
)
@app.callback(
Output({'type': 'dynamic-output', 'index': MATCH}, 'children'),
[Input({'type':'dropdown', 'index':MATCH}, 'value')],
[State({'type': 'dynamic-output', 'index': MATCH}, 'children')]
)
def display_output(a, children):
if a:
print("-->",children)
slider_comp = html.Div(children=dcc.RangeSlider(id=f'num_filter',
updatemode='drag', \
min=(1), max=(10), \
value=[(1), (10)], step=1)
)
children.append(slider_comp)
return children
return ""
if __name__ == '__main__':
app.run_server(debug=True)
其中一个技巧是添加:
if children=="":
children = []
这适用于我的情况，但我不明白为什么当我在其中设置了一些值 ['a'] 时，为什么孩子们没有显示.
This will work for my case but I ain't getting it why children is showing none when I have set some values ['a'] in it.
推荐答案
看看你的错误:
AttributeError: 'str' object has no attribute 'append'
并不是说您的对象是 None，而是说它是 str 并且字符串没有附加功能.Strings 和 None 是两种不同的类型！
It's not saying that your object is None, it's saying that it is str and strings do not have an append function. Strings and None are two different types!
现在您遇到的根本问题是您在函数的最后一行将 dynamic-output 设置为字符串值:
Now the root problem that you have is that you set your dynamic-output to a string value in the last line of your function:
def display_output(a, children):
if a:
(...)
return children
return ""
如果你返回一个列表而不是"你应该没事.
If you return a list instead of "" you should be fine.
这篇关于无法附加到 div 子组件中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
