|
|
@@ -1,6 +1,7 @@
|
|
|
<route lang="json5" type="page">
|
|
|
{
|
|
|
layout: 'default',
|
|
|
+ needLogin: true,
|
|
|
style: {
|
|
|
navigationStyle: 'custom',
|
|
|
},
|
|
|
@@ -25,7 +26,18 @@ defineOptions({
|
|
|
const paging = ref(null)
|
|
|
// 类似mixins，如果是页面滚动务必要写这一行，并传入当前ref绑定的paging，注意此处是paging，而非paging.value
|
|
|
useZPaging(paging)
|
|
|
+const changeNavbarThreshold = 100 // 滚动到这个高度时改变导航栏颜色
|
|
|
|
|
|
+const navBgColor = ref('transparent')
|
|
|
+onPageScroll((e) => {
|
|
|
+ // 根据滚动高度改变导航栏背景色
|
|
|
+ if (e.scrollTop > changeNavbarThreshold) {
|
|
|
+ navBgColor.value = '#ffffff'
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ navBgColor.value = 'transparent'
|
|
|
+ }
|
|
|
+})
|
|
|
// 搜索结果
|
|
|
const dataList = ref([])
|
|
|
async function queryList(pageNo: number, pageSize: number) {
|
|
|
@@ -60,12 +72,12 @@ onLoad(() => {
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
- <wd-navbar custom-class="bg-transparent!" safe-area-inset-top :bordered="false" fixed>
|
|
|
+ <wd-navbar :custom-style="`background: ${navBgColor}`" safe-area-inset-top :bordered="false" fixed>
|
|
|
<template #left>
|
|
|
- <wd-icon name="thin-arrow-left" color="#fff" size="32rpx" @click="() => goBack()" />
|
|
|
+ <wd-icon name="thin-arrow-left" :color="navBgColor === '#ffffff' ? '#000000' : '#ffffff'" size="32rpx" @click="() => goBack()" />
|
|
|
</template>
|
|
|
<template #title>
|
|
|
- <view class="text-white font-bold text-32rpx!">
|
|
|
+ <view class="font-bold text-32rpx!" :style="{ color: navBgColor === '#ffffff' ? '#000000' : '#ffffff' }">
|
|
|
{{ $t('referEarn.title') }}
|
|
|
</view>
|
|
|
</template>
|
liangan