為什麼layui進度條無法渲染出來

前言：

layui進度條渲染分為兩種情況，分別是：靜態渲染和動態渲染。

 <div class="layui-progress layui-progress-big" lay-filter="demo" lay-showPercent="yes">
        <div class="layui-progress-bar layui-bg-green" lay-percent="50%"></div>
 </div>

單獨上面一段程式碼，進度條值是無法顯示的。

（1）靜態渲染

 進度條依賴element元件，如果未引入，進度條將無法顯示。

layui.use('element', function () {
    var element = layui.element;
});

此時進度條顯示結果如下：

（學習影片分享：html影片教學）

（2）動態渲染

需要動態改變進度條的進度值時，layui官網上說，element模組提供了element.progress()的基礎方法。

先設定進度條過濾器（lay-filter="demo")，然後就只需要在某個事件或語句中執行該方法，即可實現動態改變精確度條值。但對於精確度條中顯示的百分比文字，使用者需要自行進行變更。

element.progress('demo', '80%');

此時進度條值改變：

相關推薦：layui教學

以上是為什麼layui進度條無法渲染出來的詳細內容。更多資訊請關注PHP中文網其他相關文章！