2019独角兽企业重金招聘Python工程师标准>>> 
1. 创建一个select元素
<form class="layui-form layui-form-pane all-account-filter-form"><div class="layui-form-item"><div class="layui-inline"><label class="layui-form-label">Package</label><div class="layui-input-inline"><select id="select-package" class="layui-input" lay-search lay-filter="package-select-filter"><option value="">All</option></select></div></div></div>
</form>
2. js引入form
layui.use(['form'], function() {let layForm = layui.form;
});
3. 定义vue数据
let app = new Vue({el: '#all-account',data: {packageList: []}
});
4. ajax获取数据
getAllPackage(app, $('#select-package'));function getAllPackage(vueObj, $select) {let params = {area: 0};sendGetRequest('/package/allPackage', params, function (responseData) {let result = getResponseContent(responseData, []);initAllPackage(vueObj, result);for (let i in vueObj.packageList) {$select.append('<option class="select-package-item" value="'+vueObj.packageList[i].packageId+'">'+vueObj.packageList[i].packageName+'</option>');}});
}
5. 给vue添加update方法，在vue数据更新的时候重新渲染form
let app = new Vue({el: '#all-account',data: {accountList: [],packageList: [],dateTypeList: [],page: {count: 0}},updated: function() {layForm.render();}
});
6. 注意
- 经过一天的测试，没有找到可以直接使用vue数据双向绑定的办法，假如各位老铁找到好的办法，还请告知一声。
- 经过测试，发现在业务代码里面进行form重新渲染，还是不起作用，应该是vue的数据绑定需要时间，还没等绑定完成，渲染过程已经执行完了，所以把渲染的过程放到vue数据绑定之后，也就是vue的update方法中执行。
