<!--
|
* @Author: 小明丶
|
* @Date: 2020-05-08 09:28:54
|
* @LastEditors: 小明丶
|
* @LastEditTime: 2020-05-21 15:38:20
|
* @Description:
|
-->
|
<template>
|
<div class="home-page">
|
<router-view></router-view>
|
<van-tabbar v-model="active" active-color="#5194FE" inactive-color="#666666" route @change="onChange">
|
<van-tabbar-item v-for="(item,index) in footerNav" :key="index" :to="item.to">
|
<template #icon="props">
|
<svg class="icon" aria-hidden="true" style="width:26px;height:26px;">
|
<use v-if="props.active" :xlink:href="'#' + item.icon_h" />
|
<use v-else :xlink:href="'#' + item.icon" />
|
</svg>
|
</template>
|
<span>{{item.title}}</span>
|
</van-tabbar-item>
|
</van-tabbar>
|
</div>
|
</template>
|
<script>
|
import Vue from "vue";
|
import { Tabbar, TabbarItem } from "vant";
|
import { mapState } from "vuex";
|
Vue.use(Tabbar);
|
Vue.use(TabbarItem);
|
export default {
|
data() {
|
return {
|
active: 0
|
};
|
},
|
computed: {
|
...mapState(['footerNav']),
|
},
|
created() {
|
if (window.location.search) {
|
// 微信授权登录后返回此页面含有code及state值，将code值发到后端，以获取用户unionId关联电话
|
}
|
},
|
methods: {
|
onChange(){
|
console.log(this.active)
|
}
|
}
|
};
|
</script>
|
<style lang="less" scoped>
|
</style>
|
