supply-chain-h5/src/components/common/home.vue

<template>
	<div class="container">
		<transition name="fade" mode="out-in">
			<!-- <keep-alive> -->
			<router-view @iconNum="iconNum" ref='routerList'></router-view>
			<!-- </keep-alive> -->
		</transition>
		<yd-tabbar :fixed="true" style="z-index: 999999;" color="#666" v-if="$route.meta.tabberShow">
			<yd-tabbar-item title="需求发布" link="/need/cache">
				<yd-icon name="need" custom slot="icon" size="0.6rem"></yd-icon>
				<yd-badge slot="badge" type="danger" v-text="needCache" v-if="needCache"></yd-badge>
			</yd-tabbar-item>
			<yd-tabbar-item title="常买清单" link="/bill"><yd-icon name="likes" custom slot="icon" size="0.6rem"></yd-icon></yd-tabbar-item>
			<yd-tabbar-item title="订单" link="/order">
				<yd-icon name="orders" custom slot="icon" size="0.6rem"></yd-icon>
				<yd-badge slot="badge" type="danger" v-text="orderNum" v-if="orderNum"></yd-badge>
			</yd-tabbar-item>
			<yd-tabbar-item title="我的" link="/personal" :active="active"><yd-icon name="my" custom slot="icon" size="0.6rem"></yd-icon></yd-tabbar-item>
		</yd-tabbar>
	</div>
</template>

<script>
import request from '@/utils/request';
export default {
	props:['orderNum'],
	data() {
		return {
			active: false,
			needCache: ''
		};
	},
	created() {
		var _this = this;
		this.$root.$on('cacheList', function(res) {
			typeof res == 'function' && res(_this.$refs);
		});
	},
	methods: {
		iconNum(obj) {
			this[obj.name] = obj.num;
		}
	}
};
</script>