在引导前端显示 Flask 下拉菜单答案

【问题标题】：Show Flask dropdown on bootstrap frontend在引导前端显示 Flask 下拉菜单
【发布时间】：2021-08-12 14:30:39
【问题描述】：

我有一个烧瓶后端处理数据，我已经能够生成一个医院列表，我希望将其显示为仪表板上的下拉列表以供选择。这是我使用的前端代码

                <!--Hospitals select list-->
                <div class="dropdown">
                    <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                      Dropdown button
                    </button>
                    <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                        <select class="form-select form-select-lg mb-3" name="hospital" method="GET" action="/">
                            <option value="{{hospitals[0]}}" selected>{{hospitals[0]}}</option>
                            {% for hospital in hospitals[1:] %}
                            <option value="{{hospital}}" >{{hospital}}</option>
                            {%endfor%}
                        
                        </select>
                    </div>
                  </div>

此代码没有提供可以使用的良好样式的下拉菜单。请参阅下面的照片

我确实想获得解决此问题的帮助，以便我可以使用干净的下拉菜单。

【问题讨论】：

标签： python html reactjs flask bootstrap-4

【解决方案1】：

这是一个前端问题。您不需要处理下拉按钮的位。相反，我会保留这一点

<select class="form-select form-select-lg mb-3" name="hospital">
    <option value="{{hospitals[0]}}" selected>{{hospitals[0]}}</option>
    {% for hospital in hospitals[1:] %}
        <option value="{{hospital}}" >{{hospital}}</option>
    {%endfor%}                        
</select>

你也可以把它放在一个 div 里面，让它从自己的行开始

注意：选择不需要 GET 或操作，所以我从上面的代码中删除了这些属性

【讨论】：