LarchLiu / vue3-video-player

vue3 version of vue-core-video-player
https://larchliu.github.io/vue3-video-player/
98 stars 20 forks source link

How to Initiate the play function of the video on click of a different button #15

Closed arpitharajanna closed 2 years ago

LarchLiu commented 3 years ago

Well, I'll add the feature to customize the controls later. #14

LarchLiu commented 3 years ago

🙌 v0.3.4 release, enjoy & feedback

demo

use slot name 'cusControls' such like

<vue3-video-player :src="source" :view-core="viewCore">
  <template #cusControls>
    <picture-in-picture :player="player" />
    <span class="btn-play" @click="play">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="41"
        height="47"
        viewBox="0 0 41 47"
      >
        <path
          d="M23.5,0,47,41H0Z"
          transform="translate(41) rotate(90)"
          fill="#fff"
        />
      </svg>
    </span>
  </template>
</vue3-video-player>

you can use custom components like PictureInPicture

if you want to use video player funtion, just pass props of view-core and you will get the instance of player

const viewCore = (player) => {
  console.log(player);
  this.player = player;
};

13 #14 #15