You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
94 lines
2.0 KiB
94 lines
2.0 KiB
<template> |
|
<HeaderNav :title="title"></HeaderNav> |
|
<view :class="{show:(footCheck === 'home')}"> |
|
<HomePage v-show="(footCheck === 'home')"></HomePage> |
|
</view> |
|
<view :class="{show:(footCheck === 'order')}"> |
|
<OrderPage v-show="(footCheck === 'order')"></OrderPage> |
|
</view> |
|
<view :class="{show:(footCheck === 'chat')}"> |
|
<ChatPage v-show="(footCheck === 'chat')"></ChatPage> |
|
</view> |
|
<view :class="{show:(footCheck === 'user')}"> |
|
<UserPage v-show="(footCheck === 'user')"></UserPage> |
|
</view> |
|
<RightNav></RightNav> |
|
<FooterNav></FooterNav> |
|
</template> |
|
|
|
<script> |
|
import FooterNav from '@/components/FooterNav/Index.vue'; |
|
import RightNav from '@/components/RightNav/Index.vue'; |
|
import HeaderNav from '@/components/HeaderNav/Index.vue'; |
|
import HomePage from '@/pages/Index/components/HomePage/Index.vue'; |
|
import OrderPage from '@/pages/Index/components/OrderPage/Index.vue'; |
|
import ChatPage from '@/pages/Index/components/ChatPage/Index.vue'; |
|
import UserPage from '@/pages/Index/components/UserPage/Index.vue'; |
|
export default { |
|
components: { |
|
FooterNav, |
|
RightNav, |
|
HeaderNav, |
|
HomePage, |
|
OrderPage, |
|
ChatPage, |
|
UserPage, |
|
}, |
|
data() { |
|
return { |
|
title: '', |
|
footCheck: 'home', |
|
} |
|
}, |
|
onLoad() { |
|
|
|
}, |
|
methods: { |
|
// store. |
|
}, |
|
onPageScroll(res) { |
|
if (res.scrollTop <= 20) { |
|
uni.$emit('isTop', true); |
|
} else { |
|
uni.$emit('isTop', false); |
|
} |
|
|
|
}, |
|
created() { |
|
// this.pagePadding = (api.navHeight().navPaddingTop+ |
|
// api.navHeight().navHeight + (api.navHeight().headerPadding *2)) |
|
}, |
|
mounted() { |
|
this.title = this.$store.state.title; |
|
}, |
|
watch: { |
|
"$store.state.footCheck": { |
|
handler(newVal, oldVal) { |
|
this.footCheck = newVal; |
|
} |
|
}, |
|
"$store.state.title": { |
|
handler(newVal, oldVal) { |
|
this.title = newVal; |
|
} |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss"> |
|
@keyframes show { |
|
0% { |
|
display: block; |
|
opacity: 0; |
|
} |
|
|
|
100% { |
|
opacity: 1; |
|
} |
|
} |
|
|
|
.show { |
|
animation: show .5s; |
|
} |
|
</style> |