123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081 |
- <template>
- <view class="scrollPage-header">
- <view :style="{height:statusBarHeight+'px'}"></view>
- <view class="header-title-box">
- <view class="header-left" @click="goBack">
- <uni-icons type="arrowleft" size="16"></uni-icons>
- <text>{{isShare?'首页':'返回'}}</text>
- </view>
- <view class="header-title"><text :max-lines="1" overflow="ellipsis">{{title}}</text></view>
- <view class="header-right">
- </view>
- </view>
- </view>
- </template>
- <script>
- export default {
- name: "sklineHeader",
- props: {
- title: {
- type: String,
- default: '标题'
- },
- isShare: {
- type: Boolean,
- default: false
- }
- },
- data() {
- return {
- statusBarHeight: 0,
- };
- },
- created() {
- this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
- },
- methods: {
- goBack() {
- if(this.isShare){
- uni.reLaunch({
- url: '/pages/index/index'
- })
- }else{
- uni.navigateBack()
- }
- },
- }
- }
- </script>
- <style lang="less">
- .scrollPage-header{
- z-index: 1;
- .header-title-box{
- display: flex;
- align-items: center;
- justify-content: space-between;
- padding: 0 10px;
- height: 44px;
- background-color: #FFFFFF;
- border-bottom: 1px solid #e8e8e8;
- .header-title{
- font-size: 16px;
- color: #333333;
- max-width: 70%;
- }
- .header-left{
- display: flex;
- align-items: center;
- text{
- font-size: 14px;
- color: #333333;
- margin-left: 2px;
- }
- }
- .header-right{
- width: 50px;
- }
- }
- }
- </style>
|