炫酷，纯Python开发LOL英雄信息查询平台

最新推荐文章于 2022-07-22 23:19:04 发布

迢迢x

最新推荐文章于 2022-07-22 23:19:04 发布

阅读量701

点赞数

文章标签： bootstrap 前端 html

本文链接：https://blog.csdn.net/a55656aq/article/details/123180637

版权

简介：

今天的文章内容非常精彩实用，最后一部分会教大家纯Python编写出下面这样炫酷的应用（动图录制出来太大，所以压缩完之后看起来有点卡，但实际运行非常流畅推荐大家亲自运行体验。

正文：

今天的教程我们将继续来学习Dash中有关表单控件的一些高级知识，get到这些知识之后，我们就有能力开发出更加完善和先进的网页表单功能。

2 Dash表单控件进阶

在正式的开发网页表单时，不仅仅是将表单控件排列摆放出来那么简单随意，我们往往需要为控件添置一些补充内容，从而更好地引导用户使用它们，或是扩充出更多功能，这在Dash中我们可以借助dash_bootstrap_components的力量：

2.1 利用Form()、FormGroup()更好地组织表单

dash_bootstrap_components中的Form()与FormGroup()被设计用于更快捷地排布我们的表单控件，使用逻辑是先用FormGroup()组织好每一个表单控件，再将若干个FormGroup()形成的列表作为Form()的children即可，从下面这个简单的例子出发：

❝
app1.py
❞

import dash
import dash_html_components as html
import dash_bootstrap_components as dbc

app = dash.Dash(__name__)

app.layout = html.Div(
    dbc.Container(
        dbc.Form(
            [
                dbc.FormGroup(
                    [
                        dbc.Label("用户名", html_for="username"),
                        dbc.Input(id="username", placeholder="请输入用户名", autoComplete='off')
                    ]
                ),

                dbc