ホームページ > ウェブフロントエンド > ライユイのチュートリアル > 私のlayuiプログレスバーがレンダリングできないのはなぜですか?

私のlayuiプログレスバーがレンダリングできないのはなぜですか?

王林
リリース: 2020-12-11 16:30:01
転載
8433 人が閲覧しました

私の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) 静的レンダリング

プログレスバーは要素コンポーネントに依存しており、導入されていない場合はプログレスバーは表示されません。

layui.use(&#39;element&#39;, function () {
    var element = layui.element;
});
ログイン後にコピー

この時点で、進行状況バーには次の結果が表示されます。

私のlayuiプログレスバーがレンダリングできないのはなぜですか?

(2) 動的レンダリング

動的にレンダリングする必要がある場合プログレスバーのプログレス値を変更するには、layui 公式 Web サイトによれば、要素モジュールは element.progress() の基本メソッドを提供します。

最初にプログレス バー フィルター (lay-filter="demo") を設定します。その後、イベントまたはステートメントでこのメソッドを実行するだけで、精度バーの値を動的に変更できます。ただし、精度バーに表示されるテキストの割合については、ユーザーが自分で変更する必要があります。

element.progress(&#39;demo&#39;, &#39;80%&#39;);
ログイン後にコピー

この時点で、進行状況バーの値が変化します:

私のlayuiプログレスバーがレンダリングできないのはなぜですか?

以上が私のlayuiプログレスバーがレンダリングできないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:csdn.net
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート