vue3-youtube
    TypeScript icon, indicating that this package has built-in type declarations

    0.1.9 • Public • Published

    vue3-youtube

    Wrapper for YouTube IFrame Player API

    Installation

    npm install vue3-youtube
    # or
    yarn add vue3-youtube

    Usage

    Browser:

    <script src="dist/vue3-youtube.umd.min.js"></script>

    Global registration:

    import Vue from 'vue'
    import YouTube from 'vue3-youtube'
    
    Vue.component('YouTube', YouTube)

    or locally:

    <template>
        <YouTube 
            src="https://www.youtube.com/watch?v=jNQXAC9IVRw" 
            @ready="onReady"
            ref="youtube" />
    </template>
    
    <script>
    import { defineComponent } from 'vue'
    import YouTube from 'vue3-youtube'
    
    export default defineComponent({
        components: { YouTube },
        methods: {
            onReady() {
                this.$refs.youtube.playVideo()
            },
        },
    })
    </script>

    Props

    Name Type Default Description
    src String Youtube video link or ID. Required.
    width Number, String 640 Player width.
    height Number, String 360 Player height.
    host String Points host to correct origin for CORS.
    vars Object Player parameters.

    Events

    • ready
    • state-change
    • playback-quality-change
    • playback-rate-change
    • error
    • api-change

    Methods

    https://developers.google.com/youtube/iframe_api_reference#Functions

    Install

    npm i vue3-youtube

    DownloadsWeekly Downloads

    344

    Version

    0.1.9

    License

    MIT

    Unpacked Size

    696 kB

    Total Files

    10

    Last publish

    Collaborators

    • nomnes