martial-arts/components/list.vue

<template>
	<view class="disjbac fw">
		<view @tap="goDetail(item.id)" class="radius8 bacf pad12 boxshow1 width48_6 mar-s20 flexs" v-for="(item,index) in list" :key="index">
			<image :src="item.cover" style="height: 226rpx;" mode="aspectFill" class="width100" lazy-load></image>
			<view class="fon24 pad-zy8 disjb fc" style="color: #262626;">
				<view class="clips2 mar-sx10" style="height: 64rpx;">{{item.name}}</view>
				<view class="disjbac ae pad-x10">
					<view class="">
						<span class="bold colf8">￥{{item.price}}</span>
						<span class="fon20 mar-z10 tline-through" style="color: #969696;">￥{{item.original_price}}</span>
					</view>
					<view v-if="!ifCourse" class="radius18 pad-zy12 disjcac flexs fon20" style="color: #f37617;border: 2rpx solid #f37617;">购买</view>
					<view v-else class="radius16 pad-zy10 disjcac colf flexs fon20" style="border: 2rpx solid #f37617;background-color: #f37617;">去学习</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"list",
		props:{
			ifCourse:{
				type:Boolean,
				default:false
			}
		},
		data() {
			return {
				list:[]
			};
		},
		methods:{
			goDetail(id){
				this.$emit('goDetail',id);
			}
		}
	}
</script>

<style>

</style>