storevisit-ui-mobile/src/components/zRadioD.vue

<template>
	<div class="zSelect">
		<div class="checkbox">
			<van-radio-group v-model="zradioc" disabled>
				<van-radio
					:name="item.collectionOptionId + ''"
					v-for="(item, index) in zRadiocolumns"
					:key="index"
					>{{ item.collectionOption }}
				</van-radio>
			</van-radio-group>
		</div>
	</div>
</template>

<script>
export default {
	name: 'zSelect',
	props: {
		radio: '',
		zRadiocolumns: [],
	},
	data() {
		return {
			zradioc: this.radio
		};
	}
};
</script>

<style scoped>
.van-f-red {
	color: red;
	width: 4px;
	display: inline-block;
}

.zSelect .z-cell {
	padding: 10px 16px 0 16px;
	font-size: 16px;
}

.checkbox .van-radio {
	padding-bottom: 10px;
}
</style>
<style>
.checkbox .van-radio__icon {
	border: 1px solid #333;
	border-radius: 80px;
	width: 1em;
}

.checkbox .van-radio__icon .van-icon {
	border: 0 !important;
	height: 1em;
	width: 1em;
}

.checkbox .van-radio__icon--checked .van-icon {
	color: #1989fa;
	background-color: #fff;
  display: block;
  height: 14px;
  width: 14px;
  margin: 2px auto;
	background-color: #1989fa;
	color: transparent;
}

.checkbox .van-radio__icon--checked {
	border: 1px solid #1989fa;
}
</style>