<template>
  <div>
    <div
      class="bg-color-red"
      style="height: 0.7rem; position:fixed; z-index:999; top:0; width: 100%;"
    >
      <div
        class=""
        style="width: 100%; display: flex; line-height: 0.7rem; font-size: 0.35rem;"
      >
        <div
          class="iconfont icon-xiangzuo"
          style="color: #FFFFFF; font-size: 0.35rem; padding-left: 10px;"
          @click="returns"
        ></div>
        <div
          style="color: #FFFFFF; font-weight: 400; flex: auto; text-align: center; padding-right: 30px;"
        >
          {{ titles }}
        </div>
      </div>
    </div>
    <div style="height: 0.7rem;"></div>
  </div>
</template>

<script>
export default {
  name: "NavBar",
  props: {
    title: String
  },
  data: function() {
    return {
      titles: ""
    };
  },
  mounted: function() {
    if (this.title == undefined) {
      this.titles = this.$route.meta.title;
    } else {
      this.titles = this.title;
    }
  },

  methods: {
    returns: function() {
      this.$router.back();
    }
  }
};
</script>

<style></style>
