layui + vue实现list单选列表

根据下拉框选择内容，动态生成单选列表。

html

<div class="layui-col-xs3 layui-col-sm3 layui-col-md2 treeDiv layui-form"  lay-filter="selFilter" >
	<p class="treeTitle" align="center">单选列表</p>
	<div class="treeSeach layui-inline" style="width: 90%; padding-right: 5%;" id="state_select">
		<select name="org" id="org" lay-filter="orgInfo"></select>
	</div>
	<div style="height: 90%;" id="rtu_list">
		<ul style="height: 100%; padding-left: 25px;">
			<li v-for="item in items">
				<input name="rtu" :title="item.name" type="radio" :value="item.rtu_no" lay-filter="rtu_obj">
			</li>
		</ul>
	</div>
</div>

js

var vm = new Vue({
	el: "#rtu_list",
	data:{
		items:[]
	}
})

layui.use(['layer', 'form', 'table'], function() {
	var layer = layui.layer,
		form = layui.form,
		table = layui.table,
		$ = layui.jquery,
		laypage = layui.laypage;

	//var org_cid = LocalData.getOrg().cascade_id;
	//var org_id = LocalData.getOrg().id;
    var org_cid = "0.001";
    var org_id = "3";
	
	
	select.setUrlSelectData("/admin/org/list",{cascade_id:org_cid},"org","selFilter",form,false,function(data){
		$("#org").val(org_id);
		form.render('select', 'selFilter');
		queryRtuList(org_id);
	});
	
    //下拉框选中事件
	form.on('select(orgInfo)', function(data){
		queryRtuList(data.value);
		Table.removeData('tableReload',table);
	});    
	
	function queryRtuList(id){
		if(comm.isEmpty(id)){
			vm.items = [];
		}else{
			Ajax.Post(rtu_url,{org_id: id},function(data){
				vm.items = data.data;
			});
		}
		setTimeout(function(){
			form.render('radio', 'selFilter');
		},100)
	}
	
    //列表单选事件
	form.on('radio(rtu_obj)', function(data){
		if( param.rtuNo != data.value){
			param.rtuNo = data.value;
			tableRender();
		}
	});  

});