select2如何使用？

由于服务器压力，如果数据多 会造成服务器卡顿 下拉搜索如何变成远程搜索来解决服务器压力 这就可以使用select2

先标明select2官网：

https://select2.org/

html

<select id="import-select2" multiple="multiple" ></select>

select2与一般的select的数据有差异，它需要特定的格式
，官方的数据结构如下：

js

引入js
 <link rel="stylesheet" type="text/css" href="/bootstrap/plugins/select2/select2.min.css">
    <script src="/bootstrap/plugins/select2/select2.js"></script>
//  初始化select2
      $("#import-select2").select2({
          placeholder: '请搜索联系人',   
          multiple:true,  //是否多选
          language : BW8i18n.getLocale() === 'en_US' ? 'en-US' : 'zh-CN',
          allowClear:false,
          closeOnSelect:close,
          tokenSeparators:[ ',' ,'' ], //数组类型
          ajax:{
              type:'POST',
              url:'.../.../url',  //这里是接口地址
              delay: 250,
              dataType:'json',
              //params 接口传入的值
              data: function (params) {
                  return {
                      contactorName: params.term, //当前搜索框里面的值
                      limit:100,
                      offset:0
                  };
              },
              // 如果后端返回的数据不是官方结构 通过processResults 来变成官方结构
              processResults: function (data) {
                  var newlist = []
                  var list = data.rows
                  for(var i=0;i<list.length;i++){
                      newlist.push({
                          id:list[i].cId,
                          text:list[i]._companyName?list[i]._companyName+'|'+list[i].realName+'('+list[i].cId+')':list[i].realName+'('+list[i].cId+')'
                      })
                  }
                  //正确的返回格式
                  return {
                      results: newlist
                  };
              },
          }
        
      });