• 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上面才管用,是一个禁用的小标识*/
                }
  • 相关阅读:
    java之JDBC
    git删除未监视的文件
    java之正则表达式
    linux命令之信息显示与搜索文件命令
    linux命令之文件备份与压缩命令
    gitlab中修改项目名称客户端修改方法
    linux中使用unzip命令中文乱码解决办法
    使用Python进行统计量描述
    Machine Learning
    Courase Neural Networks for Machine Learning Lecture1 Note
  • 原文地址:https://www.cnblogs.com/liujiajiablog/p/9797681.html
Copyright © 2020-2023  润新知