<template>
	<view class="list">
		<view v-for="(item,index) in settings" :key="index"
			:class="{'txt':true,'active':checkStatus(item)}"  @click="setValue(item)">{{item}}
		</view>
	</view>
</template>

<script>
	import objMixin from './objMixin'
	export default {
		name: 'XhRadio',
		components: {},
		mixins: [objMixin],
		props: {},
		filters:{},
		data() {
			return {}
		},
		computed: {
			settings() {
				return this.item.settings || []
			}
		},
		watch: {},
		mounted() {},
		methods: {
			checkStatus(item){
				if(!item){
					return false
				}
				const dataValue = this.dataValue
				let flag = Array.isArray(dataValue) && dataValue.indexOf(item)>-1
				console.log(flag,'flag')
				return flag
			},
			setValue(txt) {
				const dataValue = this.dataValue || []
				let idx = dataValue.indexOf(txt)
				if (idx > -1) {
					dataValue.splice(idx,1)
				} else {
					dataValue.push(txt)
				}
				this.dataValue = dataValue
				this.valueChange(this.dataValue)
			}
		}
	}
</script>
<style lang="scss" scoped>
	.list {
		display: flex;

		.txt {
			color: #666;
			padding: 10rpx;

			&.active {
				background-color: red;
				color: #fff;
			}
		}
	}
</style>
