BLi/pages/index/wenjuan-list.vue

<template>
	<view class="wenjian-list">
		<image src="../../static/img/bg@2x.png" style="position: fixed;z-index: -1;width: 750rpx;top: 0;left: 0;" mode="widthFix"></image>
		<view class="wenjuan-item u-flex-col u-row-center" v-for="(item,index) in list" :key="index" @click="toinfo(item)">
			<text>{{item.quesName}}</text>
			<text>目的和内容：{{item.quesMessage}}</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				page: 1,
				list: [],
				total: 0
			}
		},
		onLoad() {
			this.getlist()
		},
		methods: {
			getlist() {
				this.$http.quesMessage({
					pageNo: this.page,
					pageSize: 10
				}).then(res => {
					this.total = res.data.result.total
					this.list = this.list.concat(res.data.result.records)
				})
			},
			toinfo(item) {
				uni.navigateTo({
					url: "./wenjuan-info?id=" + item.id
				})
			}
		}
	}
</script>

<style lang="scss">
	.wenjian-list {
		.wenjuan-item {
			width: 690rpx;
			padding: 28rpx 24rpx;
			background: rgba(255, 255, 255, 0.6);
			border-radius: 20rpx;
			border: 2rpx solid #FFFFFF;
			backdrop-filter: blur(4px);
			margin: 20rpx auto;

			text:first-child {
				font-size: 34rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #167FFF;
				margin-bottom: 24rpx;
			}

			text:last-child {
				font-size: 20rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #167FFF;
			}
		}
	}
</style>