Blame view

frontend/mobile/src/components/NavBar.vue 1.62 KB
8d73e917   陈威   初始化提交
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<template>
    <van-nav-bar
      :left-text="leftText"
      :left-arrow="leftArrow"
      :border="border"
      :fixed="fixed"
      :placeholder="placeholder"
      :z-index="zIndex"
      @click-left="onClickLeft"
      @click-right="onClickRight"
    >
      <slot slot="title" name="title">{{ title }}</slot>
      <slot slot="right" name="right"></slot>
    </van-nav-bar>
</template>
<script>
  export default {
    props: {
      title: {
        type: String,
        default: '',
      },
      leftText: {
        type: String,
        default: '',
      },
      leftArrow: {
        type: Boolean,
        default: true,
      },
      border: {
        type: Boolean,
        default: true,
      },
      fixed: {
        type: Boolean,
        default: true,
      },
      placeholder: {
        type: Boolean,
        default: true,
      },
      zIndex: {
        type: Number | String,
        default: 99,
      },
      isCustom: {
        type: Boolean,
        default: false,
      },
    },
    data() {
      return {}
    },
    methods: {
      onClickLeft() {
        if (this.isCustom) {
          this.$emit('go-back')
        } else {
          this.$router.go(-1)
        }
      },
      onClickRight() {},
    },
  }
</script>
<style lang="scss" scoped>
  ::v-deep {
    .van-nav-bar__left{
      padding-left: 10px;
    }
    .van-icon {
    color: $base-text-color;
    font-size: 22px;
  }
  }
  
  ::v-deep .van-nav-bar__text {
    color: $base-text-color;
  }
  ::v-deep .van-ellipsis {
    color: $base-text-color;

  }
  ::v-deep .van-nav-bar__title {
    font-weight: 800;
    font-size: 17px;
  }
</style>