el-select控制单选还是多选


multiple表示多选,:multiple-limit="1" 限制多选的条数为1,2就是选两个,依此类推。为0 就是不限制选几个
使用 allow-create 属性即可通过在输入框中输入文字来创建新的条目。注意此时 filterable 必须为真。

php 复制代码
  <el-form :inline="true" :model="form" class="demo-form-inline">
      <el-select v-model="form.properties_id" style="width: 300px" placeholder="请选择样品性质" filterable clearable multiple @change="getData()" :multiple-limit="limit_properties">
        <el-option v-for="item in sample_properties" :label="item.label" :value="item.value" :key="item.value"></el-option>
      </el-select>
    </el-form-item>
    <el-form-item>
      <el-select v-model="form.place_id" style="width: 300px" placeholder="请选择品名" filterable clearable multiple @change="getData()" :multiple-limit="limit_place">
        <el-option v-for="item in place_data" :label="item.label" :value="item.value" :key="item.value"></el-option>
      </el-select>
    </el-form-item>
  </el-form>
javascript 复制代码
    data() {
      return {
        sample_properties:@json($sample_properties),
        place_data:@json($place_data),
        form: {
          properties_id : [],
          place_id      : [],
        },
        limit_properties : 0,
        limit_place : 0,
      }
    },

   methods: {
     getData(){
        var that = this
        if(that.form.properties_id.length>1 && that.form.place_id.length<=1)						
        {
          that.limit_properties= 0 //没限制
          that.limit_place= 1 //限制1条
        }
        if(that.form.place_id.length>1 && that.form.properties_id.length<=1)
        {
          that.limit_properties= 1
          that.limit_place= 0
        }
       if(that.form.place_id.length==1 && that.form.properties_id.length==1)
       {
          that.limit_properties= 0
          that.limit_place= 0
       }
       //......
     },
   },
相关推荐
BingoGo21 小时前
PHP 泛型之殇 泛型 RFC 提案被拒绝
后端·php
JaguarJack21 小时前
PHP 泛型之殇 泛型 RFC 提案被拒绝
后端·php
用户3074596982072 天前
PHP 扩展——从入门到理解
php
鹏仔先生2 天前
拷贝漫画APP下载页PHP程序,后台带免费AI写作
php
云水一下3 天前
从零开始学 PHP 系列(一):PHP 的前世今生与开发环境搭建
开发语言·php
xingpanvip3 天前
星盘接口开发文档:本命盘接口指南
android·开发语言·css·php·lua
酉鬼女又兒3 天前
零基础入门计算机网络运输层:端到端通信核心作用、端口号分类规则、复用分用工作机制及UDP与TCP协议全方位对比详解
网络·网络协议·tcp/ip·计算机网络·考研·udp·php
dog2503 天前
不要再继续优化 TCP
网络协议·tcp/ip·php
Channing Lewis3 天前
PHP 解析 Excel 的那些坑:一次“行号错位”引发的数据丢失
开发语言·php·excel
Cheng小攸3 天前
渗透行为分析与检测
开发语言·php