uniapp がタブ関数を実装する方法

coldplay.xixi
リリース: 2023-01-13 00:44:07
オリジナル
6879 人が閲覧しました

Uniapp のタブ関数の実装方法: まず外枠を記述し、タブを上部に固定して [display: flex] を使用し、次に三項演算を使用してそれぞれソートを割り当て、選択されている場合は [ を追加します。 inv- h-se] スタイル; 最後に 2 つの異なるコンテナを作成し、[v-show] を使用して切り替えます。

uniapp がタブ関数を実装する方法

このチュートリアルの動作環境: Windows7 システム、uni-app2.5.1 バージョン、Dell G3 コンピューター。

Uniapp のタブ機能の実装方法:

手順:

1. 最初に外枠を書き、次に 2 つのコンテンツを書き、最初に Fix display: flex; を使用して上部のタブに、選択されたものと選択されていないものを区別する 2 つの異なるスタイルを記述します。

2. 三項演算を使用してそれぞれに並べ替えを割り当て、[When] をクリックします。最初または 2 番目のコンテナーを取得する (選択した場合)、inv-h-se スタイル

3 を追加します。最初のコンテナーはデフォルトで戻り値

4 に表示されます。最後に、2 つの異なるコンテナーを作成しますv-show を使用して


 

         
ログイン後にコピー

を切り替えます。効果は次のとおりです:

uniapp がタブ関数を実装する方法

##関連する無料学習の推奨事項:

プログラミングビデオ

以上がuniapp がタブ関数を実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!