custom-seller.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <template name="headerNavbar">
  2. <!-- 自定义导航栏 -->
  3. <view class='navbar-wrap' :style="{height:CustomBar+'px',paddingTop:StatusBar+'px',background:navbarData.bgColor ? navbarData.bgColor : ''}">
  4. <view class="navbar-text"
  5. :style="{color:navbarData.textColor ? navbarData.textColor:'',lineHeight:(CustomBar - StatusBar)+'px;',fontSize:fontSizeSetting+'px;',paddingLeft:navbarData.textLeft ? '' : 12+'px'}" :class="platformClass">
  6. {{navbarData.title ? navbarData.title : " "}}
  7. </view>
  8. </view>
  9. </template>
  10. <script>
  11. var self;
  12. export default{
  13. name:'headerNavbar',
  14. props:{
  15. navbarData: { // 由父页面传递的数据
  16. type: Object
  17. }
  18. },
  19. data() {
  20. return{
  21. CustomBar:this.CustomBar,// 顶部导航栏高度
  22. StatusBar: this.StatusBar,
  23. fontSizeSetting:this.fontSizeSetting,
  24. screenWidth:this.screenWidth,
  25. capsule:this.capsule,
  26. platformClass:this.platformClass,
  27. }
  28. },
  29. created() {
  30. if (getCurrentPages().length === 1) { // 当只有一个页面时
  31. this.navbarData.haveBack = false;
  32. } else {
  33. this.navbarData.haveBack = true;
  34. }
  35. },
  36. onLoad(){
  37. },
  38. methods:{
  39. },
  40. onShow(){
  41. }
  42. }
  43. </script>
  44. <style lang="scss">
  45. .navbar-wrap {
  46. position: fixed;
  47. width: 100%;
  48. top: 0;
  49. z-index: 100000;
  50. box-sizing: border-box;
  51. }
  52. .navbar-text {
  53. font-size: 30rpx;
  54. color: #000000;
  55. font-weight: 500;
  56. }
  57. .navbar-text.center{
  58. text-align: center;
  59. }
  60. .navbar-text.left{
  61. text-align: left;
  62. padding-left: 45px;
  63. }
  64. </style>