smart-app/components/radioTree.vue

<template>
	<view>
		 <!-- 内容 -->
		 <form v-for="(item, index) in selectList" :key="index">
		 	<!-- 一级-->
		 	<view class="cu-form-group " :class="index==0 ? '' :'margin-top-sm'" >
		 		   <text class="title ">{{item.name}}</text>
		 		<view>
		 			<text v-if="item.show==true" class="cuIcon-fold" @click="changeShow(index,item)"></text>
		 			<text v-else class="cuIcon-unfold" @click="changeShow(index,item)"></text>
		 		</view>
		 	</view>
		 	<!-- 二级 -->
		 	<view v-if="item.show && item.children"   v-for="(items, indexs) in item.children" :key="indexs" class="cu-form-group" >
		 		<radio-group @change="RadioChange(index,items)">
		 		  <radio :class="items.id==radioValue ?' checked':''"  :value="items.id" :checked="items.id==radioValue ? true:false" class="round"></radio>
		 		  <text v-if="items.name" class="title margin-left-sm">{{items.name}}</text>
		 		   <text v-else class="title margin-left-sm">{{items.user_name}}</text>
		 		</radio-group>
		 	</view>		
		 </form>
	</view>
</template>

<script>
	export default {
		props: {
		    selectList: {
		        type: Array,
		        default:[{
					name: '施工方',
					children: [{id:"1",name: '姓名1'}, {id:"2", name: '姓名2'}],
				},{
					name: '监理',
					children: [{id:"3",name: '姓名1'}, {id:"4", name: '姓名2'}],
				},{
					name: '业主',
					children: [{id:"5",name: '姓名1'}, {id:"6", name: '姓名2'}],
				}],
		    },
		},
		data() {
			return {
				radioValue:0
			};
		},
		methods:{
			changeShow(index,item){//显示子节点
				if(item.show){
					this.$set(this.selectList[index], 'show', false)
				}else{
					this.$set(this.selectList[index], 'show', true)
				}		
			},
			RadioChange(index,item){
				 this.radioValue = item.id
				 this.selectList[index].children.forEach(item => {
				     if(item.id==this.radioValue){
						 item.checked = true
					 }else{
						 item.checked = false
					 }
				}) 
				//全局事件订阅只要注册的页面都可以收到回调值
				uni.$emit('num',1)
			},
		}
	}
</script>

<style>

</style>