layui動態渲染select等組件並初始化賦值失敗

描訴：有一個用戶信息form表單，其中有部門單選框，數據庫中有一張dept（部門）表，要動態渲染出所有部門，並默認選中用戶所在部門

關鍵代碼： 轉載於：https://blog.csdn.net/weixin_30767921/article/details/99655559

1. html頁面

       <div class="layui-form-item">
           <label class="layui-form-label">所屬部門</label>
           <input type="hidden" name="deptHide" class="layui-input deptHide"><!--中間變量-->
           <div class="layui-input-inline">
               <select name="deptId" lay-filter="sysBunk" id="deptId" class="deptId" lay-search="" disabled></select>
           </div>
       </div>

   【必須使用中間變量賦值，因為layui渲染順序不一樣】

2. select渲染

       $.post("數據接口", function (data) {
           $.each(data.data, function (index, item) {
               $('#deptId').append(new Option(item.deptName, item.deptId));
           });
           $('#deptId').val($('.deptHide').val()); //部門單選框選中
           //重新渲染select
           form.render('select');
       });

    

3. form表單渲染

4. //infoList 即 class="layui-form" 所在元素對應的 lay-filter="" 對應的值
   form.val("userInfo", {//表單回顯
         "xxx": data.data.xxx,  //"name": "value",就是表單元素的name
         "deptHide": data.data.deptId,  //中間變量--因為表單渲染的優先級高於select等組件的優先級
    });
   form.render();