Sprinkler-app/page_user/photolist.vue

<template>
	<view>
		<u-navbar :is-back="true" title='识图' title-color="#000" :border-bottom="false" :background="bgc"
			id="navbar">
		</u-navbar>
        <image class="bj" :src="cartpic" mode="aspectFit"></image>
		
        <view class="list">
        	<view class="list_val" v-for="(item,index) in zwlist" :key="index" @click="btnxq(item.plantId)">
        		<view class="lt">
        			<image :src="item.url" mode=""></image>
        		</view>
        		<view class="rt">
        			<view class="name">
        				<text>{{item.name}}</text> <text style="color: #48893B;font-size: 32rpx;">{{Number(item.score * 100).toFixed(1) + '%'}}</text>
        			</view>
        			<view class="wz">
        				{{item.msg == null ? '暂无简介' : item.msg}}
        			</view>
        		</view>
        	</view>
        </view>

		
		
	</view>
</template>

<script>
	export default {
			data() {
				return {
					bgc: {
						backgroundColor: "#fff",
					},
					cartpic:'',
					zwlist:[]
					
				}
			},
			// 分享到好友（会话）
			onShareAppMessage: function() {
				return {
					title: '绿小能',
					path: '/pages/index/index'
				}
			},
			
			// 分享到朋友圈  
			onShareTimeline: function() {
				return {
					title: '绿小能',
					query: '',
					path: '/pages/index/index'
				}
			},
			onLoad(option) {
				this.cartpic = JSON.parse(option.cart)
				this.zwlist = JSON.parse(option.list)
			},
			methods:{
				btnxq(plantId){
					uni.navigateTo({
						url:'/page_user/photoxq?plantId=' + plantId
					})
				}
				
			}
		}
</script>

<style lang="less">
	/deep/ .u-title{
		margin-bottom: 22rpx;
	}
	/deep/ .uicon-nav-back{
		margin-bottom: 22rpx;
	}
	page{
		background-color: #000;
	}
	.list{
		width: 100%;
		position: fixed;
		bottom: 90rpx;
		display: flex;
		overflow: scroll;
		align-items: center;
		.list_val{
			width: 476rpx;
			height: 198rpx;
			background: rgba(255,255,255,0.2);
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			display: flex;
			margin-left: 28rpx;
			margin-right: 28rpx;
			padding: 30rpx;
			box-sizing: border-box;
			.lt{
				image{
					width: 140rpx;
					height: 140rpx;
					margin-right: 18rpx;
				}
			}
			.rt{
				.name{
					width: 100%;
					display: flex;
					justify-content: space-between;
					margin-bottom: 6rpx;
					font-size: 32rpx;
					color: #fff;
				}
				.wz{
					font-size: 28rpx;
					color: #D8D8D8;
					width: 276rpx;
					height: 90rpx;
					overflow: scroll;
				}
			}
		}
	}
	.bj{
		width: 100%;
		height: 70vh;
		position: fixed;
		top: 120rpx;
		left: 0;
	}
		
	


</style>