医学道
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
video/src/pages/preview/videoFull/videoFull.tsx

74 lines
1.6 KiB

import {Video, View} from "@tarojs/components";
import {FC, useState} from "react";
import Taro from "@tarojs/taro";
import styles from './videoFull.module.scss'
interface Params {
url: string
poster?: string
title?: string
}
const VideoFull: FC = () => {
const params = Taro.useRouter().params as unknown as Params
const video = Taro.createVideoContext('myVideo')
const [palying, setpalying] = useState(false)
Taro.useLoad(() => {
console.log(params)
if (!params.url) {
Taro.showModal({
title: '播放地址错',
success() {
Taro.navigateBack()
}
})
}
})
function click() {
if (palying) {
video.pause()
} else {
video.play()
}
}
function onError() {
Taro.showModal({
title: '视频播放错误',
confirmText: '退出',
showCancel: true,
success() {
Taro.navigateBack()
}
})
}
return (
<>
{params.title && <View className={styles.title}>{params.title}</View>}
<Video
posterSize='100%'
id={'myVideo'}
onClick={click}
className={styles.video}
controls
// poster={params.poster}
src={params.url}
autoplay
showCenterPlayBtn
autoPauseIfOpenNative
autoPauseIfNavigate
playBtnPosition='center'
showFullscreenBtn={false}
enableProgressGesture={false}
onPlay={() => setpalying(true)}
onPause={() => setpalying(false)}
onError={onError}
/>
</>
)
}
export default VideoFull