vue で要素の表示と非表示を制御するにはどのような命令が使用されますか?

vue では、「v-show」コマンドを使用して要素の表示と非表示を制御できます。このコマンドは単なる CSS ベースのスイッチです。要素の表示と非表示を制御するには、 DOM 要素の表示スタイル属性。

このチュートリアルの動作環境: Windows7 システム、vue2.9.6 バージョン、DELL G3 コンピューター。

v-show 命令

v-show 命令は、要素の表示属性を制御して、要素を表示するかどうかを決定します。 true、要素は Display、それ以外の場合は表示されません

v-show は、式の true または false 値に基づいて要素の displayCSS 属性を切り替えます (式から導出されたブール値に基づいて判断されます)。

v-showの使用法

1.要素が表示されるか非表示になるかを決定します

<el-button v-show="list.power == 1" @click="toUpload" class="toUpload" type="primary">去上传<i class="el-icon-upload el-icon--right"></i></el-button>

パラメータlist.powerかどうかに応じて、インターフェイスは 1 に等しく、1 に等しい場合は「true」、それ以外の場合は「false」です。v-show 命令は、true に等しい場合に表示され、false に等しい場合に非表示になります。

2. 三項演算子の判断

<a class="warn" v-show="true ? item.ai != null : item.ai == null" :href="&#39;http://172.168.80.149:14081/gateway/upload/upload/downloadFile?url=&#39;+item.urlai">AI</a>

実際、これは最初の形式に省略することもできます

<a class="warn" v-show="!item.ai == null" :href="&#39;http://172.168.80.149:14081/gateway/upload/upload/downloadFile?url=&#39;+item.urlai">AI</a>

こちらの方が簡単です

[関連する推奨事項: "vue.js チュートリアル"]

以上がvue で要素の表示と非表示を制御するにはどのような命令が使用されますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。