123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990 |
- <template>
- <view>
- <view>
- <home v-if="value==0" @goTab="tabbarClick" @goSearch="goSearch"/>
- <classification ref="goods" v-show="value==1" @goTab="tabbarClick" />
- <shoppingCart v-if="value==2" />
- </view>
- <uni-fab v-if="value==0||value==1" style="bottom: 200px;" ref="fab" :pattern="pattern" @fabClick="fabClick" :popMenu="false"
- horizontal="right" />
- <u-tabbar :value="value" :fixed="true" :placeholder="false" :safeAreaInsetBottom="true" activeColor="#fd5003"
- inactiveColor="#727272">
- <u-tabbar-item text="首页" @click="tabbarClick(0)">
- <image style="width: 48rpx;height: 48rpx;" slot="active-icon"
- src="/static/images/tabBar/home_selected.png"></image>
- <image style="width: 48rpx;height: 48rpx;" slot="inactive-icon" src="/static/images/tabBar/home.png">
- </image>
- </u-tabbar-item>
- <u-tabbar-item text="商品" @click="tabbarClick(1)">
- <image style="width: 48rpx;height: 48rpx;" slot="active-icon"
- src="/static/images/tabBar/classification_selected.png"></image>
- <image style="width: 48rpx;height: 48rpx;" slot="inactive-icon"
- src="/static/images/tabBar/classification.png">
- </image>
- </u-tabbar-item>
- <u-tabbar-item text="购物车" @click="tabbarClick(2)">
- <image style="width: 48rpx;height: 48rpx;" slot="active-icon"
- src="/static/images/tabBar/cart_selected.png"></image>
- <image style="width: 48rpx;height: 48rpx;" slot="inactive-icon" src="/static/images/tabBar/cart.png">
- </image>
- </u-tabbar-item>
- <!-- <u-tabbar-item text="首页" icon="home-fill" @click="tabbarClick(3)"></u-tabbar-item> -->
- </u-tabbar>
- </view>
- </template>
- <script>
- import home from './home.vue'
- import classification from './classification.vue'
- import shoppingCart from './shoppingCart.vue'
- export default {
- components: {
- home,
- classification,
- shoppingCart
- },
- data() {
- return {
- value: 0,
- pattern: {
- icon: 'home-filled',
- buttonColor: '#ea4c18'
- }
- }
- },
- onLoad(options) {
- if (uni.getStorageSync('tabKey')) {
- this.tabbarClick(uni.getStorageSync('tabKey'))
- uni.removeStorageSync('tabKey')
- }
- uni.$on('jfSearchData', (data) => {
- this.$refs.goods.searchData(data)
- })
- },
- methods: {
- tabbarClick(tab) {
- this.value = tab
- },
- fabClick() {
- uni.switchTab({
- url: '/pages/tabBar/home',
- })
- },
- goSearch() {
- this.value = 1
- // setTimeout(() => {
- // this.$refs.goods.inSearch()
- // }, 200)
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- .containerMall {
- height: calc(100vh - 85px);
- }
- ::v-deep .uni-fab__circle--rightBottom {
- bottom: 170rpx;
- }
- </style>
|