Shikong/uni-app-wx-study
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

调整

Browse Source
This commit is contained in:
shikong 2024-10-19 15:47:29 +08:00
parent ae2fff945f
commit 14cd4b5ca7
Signed by: Shikong
GPG Key ID: BD85FF18B373C341
3 changed files with 37 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/pages/category/components/item.vue → src/components/tab-view/components/item.vue
View File

@ -27,6 +27,7 @@ const props = defineProps({
<view class="min-w-0 overflow-hidden overflow-ellipsis whitespace-nowrap"> <view class="min-w-0 overflow-hidden overflow-ellipsis whitespace-nowrap">
<text class="text-base">{{ props.title }}</text> <text class="text-base">{{ props.title }}</text>
</view> </view>
<view class="flex justify-between align-middle items-center">
<view> <view>
<text class="text-orange-500 text-base">{{ props.price }}</text> <text class="text-orange-500 text-base">{{ props.price }}</text>
@ -34,6 +35,15 @@ const props = defineProps({
{{ props.oldPrice }} {{ props.oldPrice }}
</text> </text>
</view> </view>
<view class="text-right">
<slot name="button">
<view class="rounded-[50%] bg-yellow-400 w-5 h-5 leading-5 text-center font-bold">
<uni-icons type="plusempty" size="16"></uni-icons>
</view>
</slot>
</view>
</view>
</view> </view>
</view> </view>

3
src/components/tab-view/index.vue
View File

@ -2,7 +2,7 @@
import {reactive} from "vue"; import {reactive} from "vue";
import {onLoad} from "@dcloudio/uni-app"; import {onLoad} from "@dcloudio/uni-app";
import SidebarView from "@/components/sidebar-view/index.vue" import SidebarView from "@/components/sidebar-view/index.vue"
import Item from "@/pages/category/components/item"; import Item from "@/components/tab-view/components/item";
const props = defineProps({ const props = defineProps({
tabs: { tabs: {
type: Array, type: Array,
@ -67,7 +67,6 @@ onLoad(() => {
<scroll-view scroll-y class="flex-grow min-h-0 text-left"> <scroll-view scroll-y class="flex-grow min-h-0 text-left">
<Item v-for="i in 10" :key="i" <Item v-for="i in 10" :key="i"
@tap="toCommodity(i)"
img="https://www.httpbin.org/image/png" img="https://www.httpbin.org/image/png"
title="测试商品测试商品测试商品测试商品测试商品测试商品测试商品" price="9999.99"/> title="测试商品测试商品测试商品测试商品测试商品测试商品测试商品" price="9999.99"/>

25
src/pages/category/category.vue
View File

@ -2,7 +2,7 @@
import {reactive} from "vue"; import {reactive} from "vue";
import qs from "qs"; import qs from "qs";
import SideBarView from "@/components/sidebar-view/index.vue"; import SideBarView from "@/components/sidebar-view/index.vue";
import Item from "./components/item.vue"; import Item from "../../components/tab-view/components/item.vue";
const ctx = reactive({ const ctx = reactive({
current: 0, current: 0,
@ -65,12 +65,29 @@ function toCommodity() {
<template #default="{data}"> <template #default="{data}">
<scroll-view scroll-y class="flex-grow min-h-0 text-left"> <scroll-view scroll-y class="flex-grow min-h-0 text-left">
<Item v-for="i in 10" :key="i" <Item v-for="i in 2" :key="i"
@tap="toCommodity(i)" @tap="toCommodity(i)"
img="https://www.httpbin.org/image/png" img="https://www.httpbin.org/image/png"
title="测试商品测试商品测试商品测试商品测试商品测试商品测试商品" price="9999.99"/> title="测试商品测试商品测试商品测试商品测试商品测试商品测试商品" price="9999.99">
<template #button>
<view class="bg-yellow-400 text-center px-1 py-0.5 rounded text-sm">
选规格
</view>
</template>
</Item>
<Item v-for="i in 20" :key="i" <Item v-for="i in 2" :key="i"
@tap="toCommodity(i)"
img="https://www.httpbin.org/image/png"
title="测试商品测试商品测试商品测试商品测试商品测试商品测试商品" price="9999.99">
<template #button>
<view class="text-center px-1 py-0.5 text-gray-400 text-xs">
50分钟
</view>
</template>
</Item>
<Item v-for="i in 10" :key="i"
img="https://www.httpbin.org/image/jpeg" img="https://www.httpbin.org/image/jpeg"
title="测试商品" price="9999.99" title="测试商品" price="9999.99"
oldPrice="8888.88"/> oldPrice="8888.88"/>