This commit is contained in:
2025-03-28 16:04:56 +08:00
parent 156209f020
commit 0575246c02
2 changed files with 30 additions and 4 deletions

24
src/components/XImage.vue Normal file
View File

@@ -0,0 +1,24 @@
<script setup>
const {src} = defineProps({
src: {
type: String,
default: "",
}
});
const preview = () => {
uni.previewImage({
current: 0,
urls: [src],
indicator: true,
}).then();
}
</script>
<template>
<image @click="preview" v-bind="$attrs" :src="src"></image>
</template>
<style scoped lang="scss">
</style>

View File

@@ -1,6 +1,7 @@
<script setup> <script setup>
import fmt from "../../../static/images/fmt.png"; import fmt from "../../../static/images/fmt.png";
import linkIcon from '../../../static/icons/link.png'; import linkIcon from '../../../static/icons/link.png';
import XImage from "../../../components/XImage.vue";
</script> </script>
<template> <template>
@@ -17,7 +18,8 @@ import linkIcon from '../../../static/icons/link.png';
<text class="ellipsis-1 flex-grow"> <text class="ellipsis-1 flex-grow">
https://www.baidu.com/s?wd=%E7%8C%8E%E8%81%98&sa=fyb_n_homepage&rsv_dl=fyb_n_homepage&from=super&cl=3&tn=baidutop10&fr=top1000&rsv_idx=2&hisfilter=1 https://www.baidu.com/s?wd=%E7%8C%8E%E8%81%98&sa=fyb_n_homepage&rsv_dl=fyb_n_homepage&from=super&cl=3&tn=baidutop10&fr=top1000&rsv_idx=2&hisfilter=1
</text> </text>
<view class="nowrap flex-shrink !py-[7rpx] !px-[32rpx] rounded-full bg-[#E8F3FF]" style="font-size: 24rpx"> <view class="nowrap flex-shrink !py-[7rpx] !px-[32rpx] rounded-full bg-[#E8F3FF]"
style="font-size: 24rpx">
复制 复制
</view> </view>
</view> </view>
@@ -26,9 +28,9 @@ import linkIcon from '../../../static/icons/link.png';
<view class="block"> <view class="block">
<view class="block-title">评论区案例:</view> <view class="block-title">评论区案例:</view>
<view class="block-info !grid grid-cols-3 gap-[20rpx]"> <view class="block-info !grid grid-cols-3 gap-[20rpx]">
<image class="!size-[160rpx]" :src="fmt" mode="aspectFill" :draggable="false"></image> <x-image class="!size-[160rpx]" :src="fmt" mode="aspectFill" :draggable="false"></x-image>
<image class="!size-[160rpx]" :src="fmt" mode="aspectFill" :draggable="false"></image> <x-image class="!size-[160rpx]" :src="fmt" mode="aspectFill" :draggable="false"></x-image>
<image class="!size-[160rpx]" :src="fmt" mode="aspectFill" :draggable="false"></image> <x-image class="!size-[160rpx]" :src="fmt" mode="aspectFill" :draggable="false"></x-image>
</view> </view>
</view> </view>
</view> </view>