zoukankan      html  css  js  c++  java
  • vue的select 下拉框某一项设置为不可选

    select下拉框中某一项不可选置灰

    一,

      html

    <div class="sale">
          <select @change="GetCountyData()">
               <option>请选择</option>
               <option v-for="(item,index) in data" :disabled="item.is_true==1?true:false" :class="{statusbtn:item.is_true==1}">{{item.is_true}}</option>
          </select>
    </div>

    二,

     script

    export default {
            name: 'app',
            data() {
                return {

                   "data": [{
                      "is_true": "0",
                      "region_id": "12",
                      "region_name": "南昌市",
                    },
                   {
                     "is_true": "1",
                     "region_id": "13",
                     "region_name": "景德镇市",
                   },
                   {
                     "is_true": "0",
                     "region_id": "14",
                     "region_name": "萍乡市",
                   },
                   {
                     "is_true": "1",
                     "region_id": "15",
                     "region_name": "九江市",
                   },
                   {
                     "is_true": "0",
                     "region_id": "16",
                     "region_name": "新余市",
                   },
                   {
                     "is_true": "0",
                     "region_id": "17",
                     "region_name": "鹰潭市",
                   }
                  ]

                }
            },
            props: [],
            mounted() {
            },
    methods:{

    } }

    三,

        css 

    .statusbtn {
                    color: #d6caca;
                    cursor: not-allowed; /*这个在button上面才管用,是一个禁用的小标识*/
                }
  • 相关阅读:
    IIS配置和发布网站
    单点登录的理论原理(一)
    Tomcat乱码或异常
    浅谈Tomcat 、Apache、 Nginx的区别及优缺点
    KETTLE数据互交
    Centos7防火墙配置
    【linux】查看某个进程PID对应的文件句柄数量,查看某个进程当前使用的文件句柄数量
    this license XXXXXX has been cancelled
    Ubuntu16.04安装Redis
    redis的 rdb 和 aof 持久化的区别
  • 原文地址:https://www.cnblogs.com/liujiajiablog/p/9797681.html
Copyright © 2011-2022 走看看