# 事件系统和自定义组件

# 自定义组件

注意,需要严格按照格式编写基础架构

import { Component,Video,Player } from "fishplayer"

class youComponent extends Component{

  constructor(container: HTMLElement, video: Video, player: Player) {
        super(container, "div", { class: "xxx" });
        this.init();
  }

}


new Player({
        el: document.querySelector('.video'), // 播放器容器
        url: "https://novaex.cc/fireworks.mp4", // 视频地址
        title: '测试视频',  // 视频标题
        width: '100vw',
        height: '40vh',
        components: {
            left:[youComponent], // 挂载在左侧组件
            right:[youComponent] ,// 挂载在右侧组件
            center:[youComponent], // 挂载在中间组件
            top:[youComponent] // 挂载在顶部组件
        }
    })
    video属性表示video元素对应的组件
    player属性表示整个播放器对应的组件

    组件内 this.element表示当前组件的dom元素,同理也可以用video.element和player.element获取video和player对应的dom元素

toDo...正在施工