Du kan inte välja fler än 25 ämnen Ämnen måste starta med en bokstav eller siffra, kan innehålla bindestreck ('-') och vara max 35 tecken långa.

CustomHeader.vue 970B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. <template>
  2. <div class="custom-header">
  3. <image v-show="back" @click="goBack()" class="header-left" src="../static/image/icon-back.png">
  4. </image>
  5. <div :style="back?'margin-right: 30px;':''" class="header-title">
  6. {{ title }}
  7. </div>
  8. <div class="header-right">
  9. </div>
  10. </div>
  11. </template>
  12. <script>
  13. export default {
  14. props: {
  15. title: {
  16. type: String,
  17. default: '',
  18. },
  19. back: {
  20. type: Boolean,
  21. default: true,
  22. },
  23. },
  24. // 其他配置和逻辑
  25. methods: {
  26. goBack() {
  27. window.history.back(); // 返回上一级页面
  28. },
  29. },
  30. }
  31. </script>
  32. <style scoped>
  33. .custom-header {
  34. background: #FFFFFF;
  35. display: flex;
  36. flex-direction: row;
  37. justify-content: space-between;
  38. align-items: center;
  39. z-index: 999;
  40. height: 45px;
  41. }
  42. .header-left {
  43. width: 35px;
  44. height: 35px;
  45. }
  46. .header-title {
  47. text-align: center;
  48. width: 100%;
  49. font-size: 32rpx;
  50. font-weight: bold;
  51. position: relative;
  52. }
  53. /* 其他样式 */
  54. </style>