uniapp-顶部胶囊按钮组件

组件代码如下：

<template>
	<view class="navigation-bar" :style="'height:'+height">
		<view class="navigation-bar-fixed" :style="{height:height,background:(!config.transparent&&!config.linear)?config.bgcolor:'transparent'}">
			<!-- capsule or normal -->
			<view v-if="[1,2].indexOf(config.type)!= -1" :class="config.type==1?'navigation-bar-capsule':'navigation-bar-textbox'" :style="{top:marginTop}">
				<view class="button-action" hover-class="button-action-active" @click="back_">
					<image src="/static/icon/back_.png" mode=""></image>
				</view>
				<view class="button-v-line"></view>
				<view v-if="!config.share" class="button-action" hover-class="button-action-active" @click="home_">
					<image src="/static/icon/home_.png" mode=""></image>
				</view>
				<view v-if="config.share" class="button-action" hover-class="button-action-active">
					<button class="button_clear" open-type="share" hover-class="none">
						<image src="/static/icon/share_.png" mode=""></image>
					</button>
				</view>
			</view>
			<!-- custom button -->
			<view v-if="[3,4].indexOf(config.type)!= -1" @click="conduct_" :class="config.type == 3?'navigation-bar-custom-capsule':'navigation-bar-custom-textbox'" :style="{top:marginTop}">
				<image v-if="config.menuIcon" class="custom-icon" :src="config.menuIcon"></image>
				<text class="custom-describe">{
   {
   config.menuText}}</text>
			</view>
			<!-- title -->
			<view class="navigation-bar-title" :style="'margin-top:'+marginTop+';color:'+config.fontcolor">{
   {
   title}}</view>