ec.uniapp-master/components/lf-tabbar/lf-tabbar.vue

<template>
	<view>
		<lf-tabbar-box :value="currentTabBar" 
		  v-if="isShowTabBar" 
		  :close-animate-on-raisede="false">
		  <lf-tabbar-item v-for="item in tabbars"
			  :key="item.name"
			  :name="item.name"
			  :icon="item.icon"
			  :dot="item.dot"
			  :info="item.info"
			  :path="item.path"
			  :raisede="item.raisede"
			  :style="{'width': 100 / tabbars.length +'%'}"
			  @click="handleClick"
			  icon-prefix="icon">
			  {{ item.text }}
			</lf-tabbar-item>
		</lf-tabbar-box>
	</view>
</template>

<script>
	import lfTabbarBox from "./lf-tabbar-box.vue"
	import lfTabbarItem from "./lf-tabbar-item.vue"
	import { mapGetters } from "vuex";
	
	export default {
		name: 'lf-tabbar',
		components: {
			lfTabbarBox,
			lfTabbarItem
		},
		props: {
			type: {
				type: String, // 默认跳转方式redirect，可选switch
				default: 'redirect'
			}
		},
		computed: {
			...mapGetters(['currentTabBar', 'tabbars', 'isShowTabBar'])
		},
		methods: {
			handleClick (options) {
			  this.$store.commit('setCurrentTabBar', options.name);
			  this.$url(options.path, {type: this.type});
			}
		}
	}
</script>

<style>
</style>