xm-select渲染多选下拉框

xm-select 是一个基于 layui 的下拉框组件，可以实现多选、搜索、异步加载等功能。下面是一个简单的示例代码：

<div class="layui-form-item">
  <label class="layui-form-label">多选下拉框</label>
  <div class="layui-input-block">
    <select xm-select="demo2" xm-select-max="3" xm-select-search xm-select-skin="default" name="city[]" lay-verify="required" multiple>
      <option value="0">北京</option>
      <option value="1">上海</option>
      <option value="2">广州</option>
      <option value="3">深圳</option>
      <option value="4">杭州</option>
      <option value="5">南京</option>
      <option value="6">武汉</option>
      <option value="7">成都</option>
    </select>
  </div>
</div>

其中，`xm-select` 属性指定了下拉框的 ID，`xm-select-max` 属性指定了最多可选项数，`xm-select-search` 属性表示开启搜索功能，`xm-select-skin` 属性指定了皮肤样式，`multiple` 属性表示开启多选。

在 JavaScript 中，我们需要使用 `xmSelect` 函数初始化下拉框，并设置各种配置项：

layui.use(['xmSelect'], function(){
  var xmSelect = layui.xmSelect;

  var demo2 = xmSelect.render({
    el: '#demo2',
    name: 'city',
    layVerify: 'required',
    filterable: true,
    searchPlaceholder: '请选择城市',
    tips: '最多选择3个城市',
    max: 3,
    data: [{
      name: '北京',
      value: 0
    }, {
      name: '上海',
      value: 1
    }, {
      name: '广州',
      value: 2
    }, {
      name: '深圳',
      value: 3
    }, {
      name: '杭州',
      value: 4
    }, {
      name: '南京',
      value: 5
    }, {
      name: '武汉',
      value: 6
    }, {
      name: '成都',
      value: 7
    }]
  });
});

其中，`el` 属性指定了下拉框的 ID，`name` 属性指定了提交表单时的参数名，`layVerify` 属性指定了表单验证规则，`filterable` 属性表示开启搜索功能，`searchPlaceholder` 属性指定了搜索框的提示文本，`tips` 属性指定了超出可选项数时的提示文本，`max` 属性指定了最多可选项数，`data` 属性指定了下拉框的选项数据。