vue select コンポーネントを有効または無効にする方法の詳細な説明

今回は、vue select コンポーネントを有効化および無効化する方法について詳しく説明します。vue select コンポーネントを開くときと無効にするときの 注意事項は何ですか。実際のケースを見てみましょう。

ビジネス: メッセージをプッシュするには「WeChat」と「メール」の2つの方法があります。WeChatで送信する場合は、「送信するアプリケーション」を選択する必要があります。

メールで送信する場合は不要です

WeChatで送信する場合は、「送信するアプリケーション」を選択する必要があります。 、ページは次のようになります:

メールが送信されると、ページは次のようになります:

公式 Web サイトには具体的な例が示されていませんが、「無効化」 "属性は属性から見つけることができます、

AttributeDescriptionTypeDefault valuedisabled無効にするかどうかBooleanfal se

の実装:

追加 無効な属性は次の赤いマークの形式で記述され、この選択ボックスが使用可能かどうかを決定するための TRUE 値と FALSE 値を格納するために使用される isAble 変数を定義します。

<select>v-bind:disabled="isAble" clearable v-model="dataAgentEntity.ID" style="width:240px"> 
   <option>{{ item.name }}</option> 
 </select> 
export default { 
  data(){ 
    return{ 
      isAble: false,//select下拉框是否可用 
    } 
  }

その後、ロジック内の操作変数 isAble の値によって、コンポーネントの使用可能状態と無効状態が変更されます。

 methods:{ 
     Test(){ 
      var vm = this; 
       if (vm.alertType == '邮件') { 
        vm.isAble = true; //不可用 
      } 
        
     }  
}

テスト メソッドは、それを WeChat に戻す場合は、次のように変更する必要があります。利用可能な状態にしないと、また埋もれてしまいます（笑）。ただし、これはビジネスロジックであり、状況に応じて方法を紹介するだけです。

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

複数の配列を結合するときに重複データを削除する方法

アップロードされた画像のタイプとサイズを決定するために必要な手順

以上がvue select コンポーネントを有効または無効にする方法の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。