<template>
	<scroll-view class='scroll-list' scroll-x>
		<view class="list-item" @click="showDetail(item.title)" v-for="(item,index) in list" :key="index">
			<view class="item">
				<image :src="item.icon"></image>
				<text>{{ item.title }}</text>
			</view>
		</view>
	</scroll-view>
</template>

<script>
	export default{
		props:{
			list:{
				type: Array,
				default: [
					{icon:"http://8.138.171.103/static/talentPolicy.png",title:'人才政策'},
					{icon:"http://8.138.171.103/static/talentServices.png",title:'人才服务'},
					{icon:"http://8.138.171.103/static/resourceDocking.png",title:'资源对接'}
				]
			}
		},
		data(){
			return{
				
			}
		},
		methods:{
			showDetail(title = '介绍'){
				uni.navigateTo({
					url: `/pages/article/richDetail?title=${title}`
				})
			}
		}
	}
</script>

<style scoped lang="scss">
.scroll-list{
	height: 200rpx;
	width: 100%;
	white-space: nowrap;
	.list-item{
		display: inline-block;
		width: 120rpx;
		margin-left: 100rpx;
		.item{
			display: flex;
			flex-direction: column;
			align-items: center;
			image{
				width: 100rpx;
				height: 100rpx;
			}
			text{
				margin-top: 10rpx;
				color: #000;
				font-weight: bold;
				font-size: 30rpx;
			}
		}
	}
}
</style>