-
Notifications
You must be signed in to change notification settings - Fork 7.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
docs(react): update react functional component tutorial #7377
Conversation
Codecov Report
@@ Coverage Diff @@
## main #7377 +/- ##
=======================================
Coverage 79.72% 79.72%
=======================================
Files 116 116
Lines 7295 7296 +1
Branches 1753 1754 +1
=======================================
+ Hits 5816 5817 +1
Misses 1479 1479
Continue to review full report at Codecov.
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks, @FredZeng, this is super helpful!
Just had a couple of nitpicks.
docs/guides/react.md
Outdated
</div> | ||
); | ||
React.useEffect(() => { | ||
// make sure VjsPlayer only initial once |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit:
// make sure VjsPlayer only initial once | |
// make sure Video.js player is only initialized once |
// you can update player here [update player through props] | ||
// const player = playerRef.current; | ||
// player.autoplay(options.autoplay); | ||
// player.src(options.sources); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
👍🏻
docs/guides/react.md
Outdated
} | ||
}, [options]); | ||
|
||
// Dispose VjsPlayer when functional component actually unmount |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit:
// Dispose VjsPlayer when functional component actually unmount | |
// Dispose the Video.js player when the functional component unmounts |
docs/guides/react.md
Outdated
const handlePlayerReady = (player) => { | ||
playerRef.current = player; | ||
|
||
// you can handle player's events here |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit:
// you can handle player's events here | |
// you can handle player events here |
docs/guides/react.md
Outdated
}; | ||
|
||
// const changePlayerOptions = () => { | ||
// // you can update player through VjsPlayer instance |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit:
// // you can update player through VjsPlayer instance | |
// // you can update the player through the Video.js player instance |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks!
<VideoJS options={videoJsOptions}/> | ||
|
||
|
||
<VideoJS options={videoJsOptions} onReady={handlePlayerReady} /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
👍🏻
Thanks! |
Description
#7361
Specific Changes proposed
Please list the specific changes involved in this pull request.
Requirements Checklist