<!-- *******************  单选框  *******************  -->
<template>
	<view class="list">
		<view v-for="(item,index) in settings" :key="index" :class="{'txt':true,'active':item.key===dataValue}" 
		@click="setValue(item.key)">{{item.label}}</view>
	</view>
</template>

<script>
	import stringMixin from './stringMixin'
	export default {
		name: 'XhRadio',
		components: {},
		mixins: [stringMixin],
		props: {},
		data() {
			return {}
		},
		computed: {
			settings(){
				return this.item.fieldsOptions || []
			}
		},
		watch: {},
		mounted() {},
		methods: {
			setValue(txt){
				if (this.disabled) return
				this.dataValue = txt
				this.valueChange(txt)
			}
		}
	}
</script>
<style lang="scss" scoped>
	.list{
		display: flex;
		flex-wrap: wrap;
		.txt{
			color:#333;
			padding:10rpx 30rpx;
			margin: 10rpx;
			background: #F4F5F7;
			border-radius: 10rpx;
			display: flex;
			flex-wrap: wrap;
			line-height: 50rpx;
			max-width: 46%;
			align-items: center;
			&.active{
				background-color: #2272FF;
				color:#fff;
			}
		}
	}
</style>