/react-dplayer

react-dplayer

Primary LanguageJavaScriptMIT LicenseMIT

Build Status Version NPM LICENSE

react-dplayer demo next demo

Gitpod

Open the project in Gitpod (free online dev environment for GitHub) and start coding immediately.

Open in Gitpod

React component for Dplayer based on DPlayer(V1.26.0).

Install

npm install react-dplayer -D

Usage

commonjs

import DPlayer from "react-dplayer";

class Example extends Component {
    render() {
        return (
            <DPlayer
                options={{
                    video:{url: 'http://static.smartisanos.cn/common/video/t1-ui.mp4'}
                }}
                />
        )
    }
}

browser

<script src="https://unpkg.com/dplayer/dist/DPlayer.min.js" />
<script src="https://unpkg.com/react/dist/react.min.js" />
<script src="https://unpkg.com/react-dom/dist/react-dom.min.js" />
<script src="https://unpkg.com/react-dplayer/dist/react-dplayer.min.js" />
<div id="example"></div>
<script >
ReactDOM.render(React.createElement(
   'div',
    { style: { width: 800, margin: '0px auto' } },
    React.createElement(ReactDPlayer, {options:{video: {url: 'http://static.smartisanos.cn/common/video/t1-ui.mp4'} }})
), document.getElementById('example'));
</script>

The package also includes an in-built example under the /example folder. Run the sample application by cloning project and running npm start.

Props

Name Type Default Description
options Object -- read doc

Events

camel-case rule example play as onPlay

Name Params Description
allEvent default read doc

Development

  • npm run start: Run example in development mode
  • npm run compile: Build react-dplayer(commonjs)
  • npm run dist: dist react-dplayer (umd)

License

react-dplayer is released under the MIT license.