Dining_Hall/pages/components/Navbar.vue

<template>
	<page-meta :page-font-size="fontValue+'px'" :root-font-size="fontValue+'px'"></page-meta>
  <view>
    <u-navbar
      :title="title"
      @leftClick="goBack"
      @rightClick="clickIcon"
      :autoBack="true"
      placeholder :leftIconSize="leftIconSize"
      titleStyle="font-size: 32rpx;font-weight: 700;"
    >
      <view slot="right">
        <span class="right-text">{{ text }}</span>
      </view>
    </u-navbar>
  </view>
</template>

<script>

export default {
  props: {
    title: {
      type: String,
      default: ''
    },
    showBack: {
      type: Boolean,
      default: true
    },
    isBack: {
      type: Boolean,
      default: true
    },
    goTo: {
      type: String,
      default: ''
    },
    rightIcon: {
      type: String,
      default: 'plus'
    },
    showRightIcon: {
      type: Boolean,
      default: false
    },
    showRightText: {
      type: Boolean,
      default: false
    },
    text: {
      type: String,
      default: ''
    },
	leftIconSize:{
	  type: Number,
	  default: 20
	}
  },
  data() {
    return {
		fontValue:uni.getStorageSync('fontSize') || 8,
	}
  },
  methods: {
    goBack() {
      if (this.isBack) {
        uni.navigateBack()
      } else {
        if (this.goTo) {
          uni.redirectTo({
            url: this.goTo
          })
        } else {
          uni.switchTab({
            url: '/pages/index'
          })
        }
      }
    },
    clickIcon() {
      this.$emit('clickIcon')
    }
  }
}
</script>

<style lang="scss" scoped>
.right-text {
  font-weight: 400;
  font-size: 24rpx;
  color: #0f274b;
}
</style>