抽离头部组件的业务数据

components/h5header/index.vue

 <template>
 	<header>
-		<div class="status" :class="{'bgfff': isScroll}" :style="{height: barHeight + 'px'}"></div>
+		<div class="status" :class="{'bgfff': isScroll}" :style="{height: statusBarHeight + 'px'}"></div>
 		<div class="head-wrap" :class="{'bgfff': isScroll}">
 			<img @click="goBack" :src="leftIcon">
-			<span v-if="isScroll">云鹊奖</span>
+			<span v-if="isScroll">{{title}}</span>
 			<img @click="goShare" :src="rightIcon">
 		</div>
 	</header>
@@ -17,27 +17,36 @@
 
 	export default {
     name: 'h5header',
+    props: {
+    	scrollVal: {
+    		type: Number,
+    		default: 0
+    	},
+    	title: {
+    		type: String,
+    		default: '云鹊医-赋能基层医生'
+    	},
+    	shareObj: {
+    		type: Object,
+    		default: {}
+    	}
+    },
     data(){
     	return {
     		leftIcon: leftimg1,
     		rightIcon: rightimg1,
     		isScroll: false,
-    		barHeight: 20
+    		statusBarHeight: 20
     	}
     },
-    created(){
-    	try{
-    		this.$rocNative.getStatusBarHeight(res=>{
-	    		alert(JSON.stringify(res))
-	    	})
-    	}catch(err){}
-    	
-    },
-    props: {
-    	scrollVal: {
-    		type: Number,
-    		default: 0
-    	},
+    mounted(){
+  		this.$rocNative.getStatusBarHeight().then(res=>{
+    		if(this.isIOS){
+          this.statusBarHeight = res.statusBarHeight;
+        }else{
+          this.statusBarHeight = res.statusBarHeight / window.devicePixelRatio;
+        }
+    	})
     },
     watch: {
     	scrollVal(val){
@@ -57,12 +66,7 @@
     		this.$rocNative.goBack();
     	},
     	goShare(){
-    		this.$rocNative.shareWechat({
-	        shareUrl: window.location.href,
-	        title1: '年终活动-标题',
-	        title2: '年终活动-文字描述',
-	        shareImageUrl: 'https://test-file.yunqueyi.com/png/2019/11/18/1574046505000_48x48.png'
-	    	});
+    		this.$rocNative.shareWechat(this.shareObj);
     	}
     }
   }

pages/index.vue

 <template>
   <section class="index-wrap">
-    <h5header v-if="!isWeb" :scrollVal="scrollVal" />
+    <h5header v-if="!isWeb" 
+        :scrollVal="scrollVal"
+        title="云鹊奖"
+        :shareObj="shareObj"
+     />
     <div id="imgHeight1">
         <img src="../assets/img/img1.png" />
         <img src="../assets/img/img2.png" />
@@ -75,6 +79,18 @@ export default {
   },
   components: {
     h5header
+  },
+  asyncData(params){
+    return {
+        shareObj: {
+            shareUrl: 'http://' + params.req.host + params.req.originalUrl,
+            title1: '年终活动-标题',
+            title2: '年终活动-文字描述',
+            shareImageUrl: 'https://test-file.yunqueyi.com/png/2019/11/18/1574046505000_48x48.png'
+        }
+    }
+
+
   },
   data() {
     return {
@@ -83,7 +99,7 @@ export default {
         doctorIdCnt: '',
         hospitalIdCnt: '',
         scrollVal: 0,
-        isWeb: false
+        isWeb: false,
     }
   },
   created(){
@@ -201,12 +217,7 @@ export default {
    },
    // 微信分享
    goShare(){
-    this.$rocNative.shareWechat({
-        shareUrl: window.location.href,
-        title1: '年终活动-标题',
-        title2: '年终活动-文字描述',
-        shareImageUrl: 'https://test-file.yunqueyi.com/png/2019/11/18/1574046505000_48x48.png'
-    });
+    this.$rocNative.shareWechat(this.shareObj);
    },
    // 活动规则
    ruleLink(){