siyu_app/pages/course/video/test.vue

<template>
	<view class="content">
		
		<!-- <comment ref="mescrollItem" :videoId="1552"></comment> -->
		
	<!-- 	<px-popup-bottom ref="popUp" :visible.sync="specVisible"   @close="closePop" :videoId="videoId" :smsNum="pingCount"  :title="pingCount+'条评论'"  radius="32"  maxHeight="1200">
		
		</px-popup-bottom> -->
		<view class="notice-warp">
			<view class="notice">mescroll-body是原生页面的滚动,子组件无页面生命周期</view>
			<view class="notice">需通过mescroll-comp.js给子组件补充页面生命周期</view>
		</view>
		
		<!-- 评论弹窗 -->
		<popupBottom ref="mescrollItem" :visible.sync="specVisible"   @close="closePop" :videoId="videoId" :smsNum="pingCount"  :title="pingCount+'条评论'"  radius="32"  maxHeight="1200"></popupBottom>
	
	</view>
</template>

<script>
	
	// import pxPopupBottom from '@/components/px-popup-bottom/px-popup-bottom.vue'
	import popupBottom from '@/components/popupBottom/popupBottom.vue'
	// import comment from './comment.vue'
	import MescrollCompMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mixins/mescroll-comp.js";
	export default {
		mixins: [MescrollCompMixin],
		components: {
			// pxPopupBottom,
			popupBottom
			
		},
		data() {
			return {
				specVisible:false,
				pingCount:1000,
				videoId:1552
			}
		},
		onLoad() {
			
		},
		mounted() {
			setTimeout(() => {
				this.specVisible=true;
			});
			
		},
		methods: {
			closePop(){
				
			},
		}
	}
</script>

<style>
  .notice-warp{
  	z-index: 9;
  	position: fixed;
  	top: var(--window-top);
  	left: 0;
  	width: 100%;
  	height: 100rpx;/*对应mescroll-body的top值*/
  	font-size: 26upx;
  	padding-top: 10upx;
  	border-bottom: 1upx solid #eee;
  	text-align: center;
  	background-color: #fff;
  }
  .notice-warp .notice{
  	color:#555;
  }
  .notice-warp .btn-change{
  	display: inline-block;
  	margin-top: 28upx;
  	padding: 6upx 16upx;
  	border: 1upx solid #FF6990;
  	border-radius: 40upx;
  	color: #FF6990;
  }
  .notice-warp .btn-change:active{
  	opacity: .5;
  }
</style>