Python 仪表板绘图引导程序编号输入放置

因此，我想放置文本框，如图所示

然而，我的代码不起作用，而是向我展示了这一点

这是我的代码：

html.H1("Query1", style={'text-align': 'center','fontSize': 30}),
            dbc.Row(
                [
            dbc.Col(dcc.Graph(id='graphQ', figure={}),md=8),
            html.P("1"),
            dbc.Col(dbc.Input(type="number", min=0, max=10, step=1),),
            html.P("2"),
            dbc.Col(dbc.Input(type="number", min=0, max=10, step=1)),
            ]),
            dbc.Row(
                [
            html.P("1"),
            dbc.Col(dbc.Input(type="number", min=0, max=10, step=1),),
            html.P("2"),
            dbc.Col(dbc.Input(type="number", min=0, max=10, step=1),)],
                align="end",
            )
            ])]))

---

感谢您的帮助

您可以这样做：

def custom_input(paragraph_text, min_value=0, max_value=10, step=1):
    return html.Div(
        children=[
            html.P(paragraph_text, style={"paddingRight": 10}),
            dbc.Input(type="number", min=min_value, max=max_value, step=step),
        ],
        style={"display": "flex"},
    )


app.layout = html.Div(
    children=[
        html.H1("Query1", style={"textAlign": "center", "fontSize": 30}),
        dbc.Row(
            [
                dbc.Col(dcc.Graph(id="graphQ", figure={}), md=8),
                dbc.Col(
                    children=[
                        dbc.Row(
                            [
                                dbc.Col(custom_input("1")),
                                dbc.Col(custom_input("2")),
                            ],
                            style={"paddingBottom": 30},
                        ),
                        dbc.Row(
                            [
                                dbc.Col(custom_input("1")),
                                dbc.Col(custom_input("2")),
                            ],
                            style={"paddingBottom": 30},
                        ),
                    ],
                    md=4,
                ),
            ]
        ),
    ]
)

我已经将您的标签/输入组件组合抽象为一个自定义函数，希望能够使布局方法更加清晰，代码更加可重用

所以我的想法是我们只需要一行两列。其中第一列由整个图形组成

---

第二列由两行组成，每行包含两列，每列包含一个自定义输入。

感谢您的解释，代码也可以使用：）！很乐意帮忙。顺便说一句，除了接受答案外，你还可以对你认为有用的答案进行投票（因为，你通过了15个声望的投票表决）。我对答案进行了投票表决，如果你不介意的话，我有一个qn，所以我正在使用小数点，例如：5.9。我是否可以将

dbc.Input（type=“number”）

更改为

dbc.Input（type=“float”）

？或者还有其他方法吗。谢谢大家!<代码>dbc。输入支持

dbc.Input

将渲染为常规格式，以便您可以查看此文档，以获得适用于您的情况的想法。因此，这个问题实际上不是破折号问题，而是一个常规的html输入问题。因此，从我之前分享的stackoverflow帖子来看，可行的解决方案可能是使用javascript或使用

模式

属性，并使用正则表达式匹配有效的输入值。