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.
74 lines
1.5 KiB
74 lines
1.5 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
|
|
|