直播页面

pageE/zhibo/index.nvue

@@ -1,19 +1,101 @@
 <template>
-	<div>
-		<myText ref="telText" tel="11" style="width:750rem;height:100vh" @onTel="onTel" @click="myTextClick"></myText>
-	</div>
+    <view>
+        <live-pusher id='livePusher' ref="livePusher" class="livePusher" url=""
+        mode="SD" :muted="true" :enable-camera="true" :auto-focus="true" :beauty="9" whiteness="9"
+        aspect="9:16" @statechange="statechange" @netstatus="netstatus" @error = "error"
+         style="width:750rpx;height:750rpx"></live-pusher>
+        <button class="btn" @click="start">开始推流</button>
+        <button class="btn" @click="pause">暂停推流</button>
+        <button class="btn" @click="resume">resume</button>
+        <button class="btn" @click="stop">停止推流</button>
+        <button class="btn" @click="snapshot">快照</button>
+        <button class="btn" @click="startPreview">开启摄像头预览</button>
+        <button class="btn" @click="stopPreview">关闭摄像头预览</button>
+        <button class="btn" @click="switchCamera">切换摄像头</button>
+    </view>
 </template>
-
-<script>  
-    export default {  
-        data() {  
-            return {  
-            }  
-        },  
-        onLoad() {  
-        },  
-        methods: {  
-			
-        }  
-    }  
-</script>  
+<script>
+    export default {
+        data: {
+            fil: true
+        },
+        onReady() {
+            // 注意：需要在onReady中 或 onLoad 延时
+            this.context = uni.createLivePusherContext("livePusher", this);
+        },
+        methods: {
+            statechange(e) {
+                console.log("statechange:" + JSON.stringify(e));
+            },
+            netstatus(e) {
+                console.log("netstatus:" + JSON.stringify(e));
+            },
+            error(e) {
+                console.log("error:" + JSON.stringify(e));
+            },
+            start: function() {
+                this.context.start({
+                    success: (a) => {
+                        console.log("livePusher.start:" + JSON.stringify(a));
+                    }
+                });
+            },
+            close: function() {
+                this.context.close({
+                    success: (a) => {
+                        console.log("livePusher.close:" + JSON.stringify(a));
+                    }
+                });
+            },
+            snapshot: function() {
+                this.context.snapshot({
+                    success: (e) => {
+                        console.log(JSON.stringify(e));
+                    }
+                });
+            },
+            resume: function() {
+                this.context.resume({
+                    success: (a) => {
+                        console.log("livePusher.resume:" + JSON.stringify(a));
+                    }
+                });
+            },
+            pause: function() {
+                this.context.pause({
+                    success: (a) => {
+                        console.log("livePusher.pause:" + JSON.stringify(a));
+                    }
+                });
+            },
+            stop: function() {
+                this.context.stop({
+                    success: (a) => {
+                        console.log(JSON.stringify(a));
+                    }
+                });
+            },
+            switchCamera: function() {
+                this.context.switchCamera({
+                    success: (a) => {
+                        console.log("livePusher.switchCamera:" + JSON.stringify(a));
+                    }
+                });
+            },
+            startPreview: function() {
+                this.context.startPreview({
+                    success: (a) => {
+                        console.log("livePusher.startPreview:" + JSON.stringify(a));
+                    }
+                });
+            },
+            stopPreview: function() {
+                this.context.stopPreview({
+                    success: (a) => {
+                        console.log("livePusher.stopPreview:" + JSON.stringify(a));
+                    }
+                });
+            }
+        }
+    }
+    </script>