<template>
	<view class="">

		<view class="list">
			<view class="item" v-for="(item,index) in detail" :key="index">
				<text class="tip">{{item.name}}</text>
				<view class="content">
					<button v-for="(item1,index1) in item.data" :key="index1" @tap="itemClick(item1.name)">{{item1.zw}}</button>
				</view>
			</view>
		</view>


	</view>
</template>

<script>
	export default {
		data() {
			return {
				detail: []
			}
		},
		created() {
			this.loadData()
		},
		onLoad() {

		},
		methods: {
			loadData() {
				let _this=this
				uni.showLoading({
					icon: 'none',
					title: '加载中...'
				})
				uni.request({
					url: './data.json?v=' + Date.now(),
					method: 'GET',
					success(res) {
						_this.detail = res.data.fonts
						uni.hideLoading()
					}
				})
			},
			itemClick(name){
				uni.navigateBack({
					delta:1,
					success() {
						uni.$emit('font',{
							name:name
						})
					}
				})
			}
		}
	}
</script>

<style lang="less" scoped>
	.list{
		padding: 0 30upx;
		.item{
			display: flex;
			flex-direction: column;
			.tip{
				font-size: 30upx;
				color: #1d1d1d;
			}
			.content{
				display: flex;
				flex-direction: column;
				button{
					background-color: #eee;
					font-size: 24upx;
					margin-bottom: 20upx;
					text-align: left;
					padding: 0 30upx;
				}
				button::after{
					content: 'none';
				}
			}
		}
	}
</style>
