<template>
	<view>
		<tui-actionsheet zIndex="9999"
		 :show="showActionSheet" 
		 :item-list="itemList" 
		 @click="itemClick" 
		 @cancel="closeActionSheet">
		</tui-actionsheet>
	</view>
</template>

<script>
	import tuiActionsheet from "@/components/thorui/tui-actionsheet/tui-actionsheet.vue"
	export default {
		components: {
			tuiActionsheet,
		},
		props: {
			
		},
		data() {
			return {
				showActionSheet: false,
				itemList: [{
					text: "全部",
					label: '性别',
					value: '',
					color: "#2B2B2B"
				}, {
					text: "男生",
					label: '性别：男',
					value: '0',
					color: "#2B2B2B"
				}, {
					text: "女生",
					label: '性别：女',
					value: '1',
					color: "#2B2B2B"
				}],
			}
		},
		methods: {
			//隐藏组件
			closeActionSheet() {
				this.showActionSheet = false
			},
			//调用此方法显示组件
			openActionSheet() {
				this.showActionSheet = true;
			},
			itemClick(e) {
				this.$emit('sexOk', e);
				this.closeActionSheet();
			},
		}
	}
</script>

<style lang="scss" scoped>
	
</style>