"use strict";(self.webpackChunkartplayer_document=self.webpackChunkartplayer_document||[]).push([[303],{3905:function(e,t,n){n.d(t,{Zo:function(){return o},kt:function(){return s}});var a=n(7294);function l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function r(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function i(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?r(Object(n),!0).forEach((function(t){l(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):r(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function p(e,t){if(null==e)return{};var n,a,l=function(e,t){if(null==e)return{};var n,a,l={},r=Object.keys(e);for(a=0;a<r.length;a++)n=r[a],t.indexOf(n)>=0||(l[n]=e[n]);return l}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(a=0;a<r.length;a++)n=r[a],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(l[n]=e[n])}return l}var d=a.createContext({}),m=function(e){var t=a.useContext(d),n=t;return e&&(n="function"==typeof e?e(t):i(i({},t),e)),n},o=function(e){var t=m(e.components);return a.createElement(d.Provider,{value:t},e.children)},u={inlineCode:"code",wrapper:function(e){var t=e.children;return a.createElement(a.Fragment,{},t)}},k=a.forwardRef((function(e,t){var n=e.components,l=e.mdxType,r=e.originalType,d=e.parentName,o=p(e,["components","mdxType","originalType","parentName"]),k=m(n),s=l,N=k["".concat(d,".").concat(s)]||k[s]||u[s]||r;return n?a.createElement(N,i(i({ref:t},o),{},{components:n})):a.createElement(N,i({ref:t},o))}));function s(e,t){var n=arguments,l=t&&t.mdxType;if("string"==typeof e||l){var r=n.length,i=new Array(r);i[0]=k;var p={};for(var d in t)hasOwnProperty.call(t,d)&&(p[d]=t[d]);p.originalType=e,p.mdxType="string"==typeof e?e:l,i[1]=p;for(var m=2;m<r;m++)i[m]=n[m];return a.createElement.apply(null,i)}return a.createElement.apply(null,n)}k.displayName="MDXCreateElement"},3117:function(e,t,n){n.r(t),n.d(t,{frontMatter:function(){return p},contentTitle:function(){return d},metadata:function(){return m},toc:function(){return o},default:function(){return k}});var a=n(7462),l=n(3366),r=(n(7294),n(3905)),i=["components"],p={title:"\u57fa\u7840\u53c2\u6570",sidebar_position:2,slug:"/zh-cn/options"},d=void 0,m={unversionedId:"zh-cn/Options",id:"zh-cn/Options",isDocsHomePage:!1,title:"\u57fa\u7840\u53c2\u6570",description:"container",source:"@site/docs/zh-cn/Options.md",sourceDirName:"zh-cn",slug:"/zh-cn/options",permalink:"/document/zh-cn/options",tags:[],version:"current",sidebarPosition:2,frontMatter:{title:"\u57fa\u7840\u53c2\u6570",sidebar_position:2,slug:"/zh-cn/options"},sidebar:"zh-cn",previous:{title:"\u5feb\u901f\u4e0a\u624b",permalink:"/document/zh-cn"},next:{title:"\u5e38\u7528\u5c5e\u6027",permalink:"/document/zh-cn/propertie"}},o=[{value:"container",id:"container",children:[],level:2},{value:"url",id:"url",children:[],level:2},{value:"poster",id:"poster",children:[],level:2},{value:"title",id:"title",children:[],level:2},{value:"theme",id:"theme",children:[],level:2},{value:"volume",id:"volume",children:[],level:2},{value:"isLive",id:"islive",children:[],level:2},{value:"muted",id:"muted",children:[],level:2},{value:"autoplay",id:"autoplay",children:[],level:2},{value:"autoSize",id:"autosize",children:[],level:2},{value:"autoMini",id:"automini",children:[],level:2},{value:"loop",id:"loop",children:[],level:2},{value:"flip",id:"flip",children:[],level:2},{value:"rotate",id:"rotate",children:[],level:2},{value:"playbackRate",id:"playbackrate",children:[],level:2},{value:"aspectRatio",id:"aspectratio",children:[],level:2},{value:"screenshot",id:"screenshot",children:[],level:2},{value:"setting",id:"setting",children:[],level:2},{value:"hotkey",id:"hotkey",children:[],level:2},{value:"pip",id:"pip",children:[],level:2},{value:"mutex",id:"mutex",children:[],level:2},{value:"fullscreen",id:"fullscreen",children:[],level:2},{value:"fullscreenWeb",id:"fullscreenweb",children:[],level:2},{value:"subtitleOffset",id:"subtitleoffset",children:[],level:2},{value:"miniProgressBar",id:"miniprogressbar",children:[],level:2},{value:"localVideo",id:"localvideo",children:[],level:2},{value:"localSubtitle",id:"localsubtitle",children:[],level:2},{value:"useSSR",id:"usessr",children:[],level:2},{value:"layers",id:"layers",children:[],level:2},{value:"settings",id:"settings",children:[],level:2},{value:"contextmenu",id:"contextmenu",children:[],level:2},{value:"controls",id:"controls",children:[],level:2},{value:"quality",id:"quality",children:[],level:2},{value:"highlight",id:"highlight",children:[],level:2},{value:"plugins",id:"plugins",children:[],level:2},{value:"whitelist",id:"whitelist",children:[],level:2},{value:"thumbnails",id:"thumbnails",children:[],level:2},{value:"subtitle",id:"subtitle",children:[],level:2},{value:"moreVideoAttr",id:"morevideoattr",children:[],level:2},{value:"icons",id:"icons",children:[],level:2},{value:"type",id:"type",children:[],level:2},{value:"customType",id:"customtype",children:[],level:2},{value:"lang",id:"lang",children:[],level:2}],u={toc:o};function k(e){var t=e.components,n=(0,l.Z)(e,i);return(0,r.kt)("wrapper",(0,a.Z)({},u,n,{components:t,mdxType:"MDXLayout"}),(0,r.kt)("h2",{id:"container"},"container"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String\u3001Element")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"#artplayer")),(0,r.kt)("li",{parentName:"ul"},"\u5fc5\u586b: ",(0,r.kt)("inlineCode",{parentName:"li"},"\u662f"))),(0,r.kt)("p",null,"\u64ad\u653e\u5668\u6240\u6302\u8f7d\u7684 ",(0,r.kt)("inlineCode",{parentName:"p"},"dom")," \u5bb9\u5668\uff0c\u5176\u5fc5\u987b\u662f\u5177\u6709\u5c3a\u5bf8\u7684\uff0c\u5426\u5219\u64ad\u653e\u5668\u65e0\u6cd5\u663e\u793a"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    // container: document.querySelector('.artplayer-app'),\n    url: '/assets/sample/video.mp4',\n});\n")),(0,r.kt)("p",null,"\u60a8\u53ef\u80fd\u9700\u8981\u521d\u59cb\u5316\u5bb9\u5668\u5143\u7d20\u7684\u5927\u5c0f\uff0c\u5982:"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-css"},".artplayer-app {\n    width: 400px;\n    height: 300px;\n}\n")),(0,r.kt)("h2",{id:"url"},"url"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"''")),(0,r.kt)("li",{parentName:"ul"},"\u5fc5\u586b: ",(0,r.kt)("inlineCode",{parentName:"li"},"\u662f"))),(0,r.kt)("p",null,"\u89c6\u9891\u6e90\u5730\u5740\uff0c\u9ed8\u8ba4\u652f\u6301\u4e09\u79cd\u89c6\u9891\u6587\u4ef6\u683c\u5f0f\uff1a",(0,r.kt)("inlineCode",{parentName:"p"},".mp4"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},".ogg"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},".webm")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n});\n")),(0,r.kt)("h2",{id:"poster"},"poster"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"''"))),(0,r.kt)("p",null,"\u89c6\u9891\u7684\u6d77\u62a5\uff0c\u53ea\u4f1a\u51fa\u73b0\u5728\u64ad\u653e\u5668\u521d\u59cb\u5316\u4e14\u672a\u64ad\u653e\u7684\u72b6\u6001\u4e0b"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    poster: '/assets/sample/poster.jpg',\n});\n")),(0,r.kt)("h2",{id:"title"},"title"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"''"))),(0,r.kt)("p",null,"\u89c6\u9891\u6807\u9898\uff0c\u76ee\u524d\u4f1a\u51fa\u73b0\u5728\u89c6\u9891\u622a\u56fe\u548c\u8ff7\u4f60\u6a21\u5f0f\u4e0b"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    title: '\u3010\u65b0\u6d77\u8bda\u52a8\u753b\u3011\u300e\u79d2\u901f5\u30bb\u30f3\u30c1\u30e1\u30fc\u30c8\u30eb\u300f',\n    screenshot: true,\n});\n")),(0,r.kt)("h2",{id:"theme"},"theme"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"#f00"))),(0,r.kt)("p",null,"\u64ad\u653e\u5668\u4e3b\u9898\u989c\u8272\uff0c\u76ee\u524d\u53ea\u4f5c\u7528\u4e8e\u8fdb\u5ea6\u6761\u4e0a"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    theme: '#ffad00',\n});\n")),(0,r.kt)("h2",{id:"volume"},"volume"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Number")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"0.7"))),(0,r.kt)("p",null,"\u64ad\u653e\u5668\u7684\u9ed8\u8ba4\u97f3\u91cf"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    volume: 0.5,\n});\n")),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"\u64ad\u653e\u5668\u4f1a\u7f13\u5b58\u6700\u540e\u4e00\u6b21\u97f3\u91cf\u7684\u5927\u5c0f\uff0c\u4e0b\u6b21\u521d\u59cb\u5316\u65f6\uff08\u5982\u5237\u65b0\u9875\u9762\uff09\u64ad\u653e\u5668\u4f1a\u8bfb\u53d6\u8be5\u7f13\u5b58\u503c"))),(0,r.kt)("h2",{id:"islive"},"isLive"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u4f7f\u7528\u76f4\u64ad\u6a21\u5f0f\uff0c\u4f1a\u9690\u85cf\u8fdb\u5ea6\u6761\u548c\u64ad\u653e\u65f6\u95f4"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    isLive: true,\n});\n")),(0,r.kt)("h2",{id:"muted"},"muted"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u9ed8\u8ba4\u9759\u97f3"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    muted: true,\n});\n")),(0,r.kt)("h2",{id:"autoplay"},"autoplay"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u81ea\u52a8\u64ad\u653e"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    autoplay: true,\n    muted: true,\n});\n")),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"\u5047\u5982\u5e0c\u671b\u9ed8\u8ba4\u8fdb\u5165\u9875\u9762\u5c31\u80fd\u81ea\u52a8\u64ad\u653e\u89c6\u9891\uff0c",(0,r.kt)("inlineCode",{parentName:"p"},"muted")," \u5fc5\u9700\u4e3a ",(0,r.kt)("inlineCode",{parentName:"p"},"true"),"\uff0c\u66f4\u591a\u4fe1\u606f\u8bf7\u9605\u8bfb ",(0,r.kt)("a",{parentName:"p",href:"https://developers.google.com/web/updates/2017/09/autoplay-policy-changes"},"Autoplay Policy Changes")))),(0,r.kt)("h2",{id:"autosize"},"autoSize"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u64ad\u653e\u5668\u7684\u5c3a\u5bf8\u9ed8\u8ba4\u4f1a\u586b\u5145\u6574\u4e2a ",(0,r.kt)("inlineCode",{parentName:"p"},"container")," \u5bb9\u5668\u5c3a\u5bf8\uff0c\u6240\u4ee5\u7ecf\u5e38\u51fa\u73b0\u9ed1\u8fb9\uff0c\u8be5\u503c\u80fd\u81ea\u52a8\u8c03\u6574\u64ad\u653e\u5668\u5c3a\u5bf8\u4ee5\u9690\u85cf\u9ed1\u8fb9"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"// \u7f29\u653e\u6d4f\u89c8\u5668\u7a97\u53e3\u67e5\u770b\u6548\u679c\nvar art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    autoSize: true,\n});\n")),(0,r.kt)("h2",{id:"automini"},"autoMini"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u5f53\u64ad\u653e\u5668\u6eda\u52a8\u5230\u6d4f\u89c8\u5668\u89c6\u53e3\u4ee5\u5916\u65f6\uff0c\u81ea\u52a8\u8fdb\u5165\u8ff7\u4f60\u64ad\u653e\u6a21\u5f0f"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    autoMini: true,\n});\n")),(0,r.kt)("h2",{id:"loop"},"loop"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5faa\u73af\u64ad\u653e"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    loop: true,\n});\n")),(0,r.kt)("h2",{id:"flip"},"flip"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u663e\u793a\u89c6\u9891\u7ffb\u8f6c\u529f\u80fd\uff0c\u76ee\u524d\u53ea\u51fa\u73b0\u5728 ",(0,r.kt)("inlineCode",{parentName:"p"},"\u8bbe\u7f6e\u9762\u677f")," \u91cc\uff0c\u6240\u4ee5\u9700\u8981\u540c\u65f6\u8bbe\u7f6e ",(0,r.kt)("inlineCode",{parentName:"p"},"setting")," \u4e3a ",(0,r.kt)("inlineCode",{parentName:"p"},"true")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    flip: true,\n    setting: true,\n});\n")),(0,r.kt)("h2",{id:"rotate"},"rotate"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u663e\u793a\u89c6\u9891\u65cb\u8f6c\u529f\u80fd\uff0c\u9700\u8981\u540c\u65f6\u8bbe\u7f6e ",(0,r.kt)("inlineCode",{parentName:"p"},"setting")," \u548c ",(0,r.kt)("inlineCode",{parentName:"p"},"autoSize")," \u4e3a ",(0,r.kt)("inlineCode",{parentName:"p"},"true")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    rotate: true,\n    setting: true,\n    autoSize: true,\n});\n")),(0,r.kt)("h2",{id:"playbackrate"},"playbackRate"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u663e\u793a\u89c6\u9891\u64ad\u653e\u901f\u5ea6\u529f\u80fd\uff0c\u4f1a\u51fa\u73b0\u5728 ",(0,r.kt)("inlineCode",{parentName:"p"},"\u8bbe\u7f6e\u9762\u677f")," \u548c ",(0,r.kt)("inlineCode",{parentName:"p"},"\u53f3\u952e\u83dc\u5355")," \u91cc"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    playbackRate: true,\n    setting: true,\n});\n")),(0,r.kt)("h2",{id:"aspectratio"},"aspectRatio"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u663e\u793a\u89c6\u9891\u957f\u5bbd\u6bd4\u529f\u80fd\uff0c\u4f1a\u51fa\u73b0\u5728 ",(0,r.kt)("inlineCode",{parentName:"p"},"\u8bbe\u7f6e\u9762\u677f")," \u548c ",(0,r.kt)("inlineCode",{parentName:"p"},"\u53f3\u952e\u83dc\u5355")," \u91cc"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    aspectRatio: true,\n    setting: true,\n});\n")),(0,r.kt)("h2",{id:"screenshot"},"screenshot"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u5e95\u90e8\u63a7\u5236\u680f\u91cc\u663e\u793a\u89c6\u9891\u622a\u56fe\u529f\u80fd"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    screenshot: true,\n    // \u53ef\u9009\n    moreVideoAttr: {\n        crossOrigin: 'anonymous',\n    },\n});\n")),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"\u7531\u4e8e\u6d4f\u89c8\u5668\u5b89\u5168\u673a\u5236\uff0c\u5047\u5982\u89c6\u9891\u6e90\u5730\u5740\u548c\u7f51\u7ad9\u662f\u8de8\u57df\u7684\uff0c\u53ef\u80fd\u4f1a\u51fa\u73b0\u622a\u56fe\u5931\u8d25"))),(0,r.kt)("h2",{id:"setting"},"setting"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u5e95\u90e8\u63a7\u5236\u680f\u91cc\u663e\u793a\u8bbe\u7f6e\u9762\u677f\u7684\u5f00\u5173\u6309\u94ae"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    setting: true,\n});\n")),(0,r.kt)("h2",{id:"hotkey"},"hotkey"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"true"))),(0,r.kt)("p",null,"\u662f\u5426\u4f7f\u7528\u5feb\u6377\u952e"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    hotkey: true,\n});\n")),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u70ed\u952e"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"\u2191")),(0,r.kt)("td",{parentName:"tr",align:null},"\u589e\u52a0\u97f3\u91cf")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"\u2193")),(0,r.kt)("td",{parentName:"tr",align:null},"\u964d\u4f4e\u97f3\u91cf")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"\u2190")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5feb\u8fdb 5 \u79d2")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"\u2192")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5feb\u9000 5 \u79d2")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"space")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5207\u6362\u64ad\u653e/\u6682\u505c")))),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"\u53ea\u5728\u64ad\u653e\u5668\u83b7\u5f97\u7126\u70b9\u540e\uff08\u5982\u70b9\u51fb\u4e86\u64ad\u653e\u5668\u540e\uff09\uff0c\u8be5\u5feb\u6377\u952e\u624d\u4f1a\u751f\u6548"))),(0,r.kt)("h2",{id:"pip"},"pip"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u5e95\u90e8\u63a7\u5236\u680f\u91cc\u663e\u793a\u753b\u4e2d\u753b\u7684\u5f00\u5173\u6309\u94ae"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    pip: true,\n});\n")),(0,r.kt)("h2",{id:"mutex"},"mutex"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"true"))),(0,r.kt)("p",null,"\u5047\u5982\u9875\u9762\u91cc\u540c\u65f6\u5b58\u5728\u591a\u4e2a\u64ad\u653e\u5668\uff0c\u662f\u5426\u53ea\u80fd\u8ba9\u4e00\u4e2a\u64ad\u653e\u5668\u64ad\u653e"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    mutex: true,\n});\n")),(0,r.kt)("h2",{id:"fullscreen"},"fullscreen"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u5e95\u90e8\u63a7\u5236\u680f\u91cc\u663e\u793a\u64ad\u653e\u5668\u7a97\u53e3\u5168\u5c4f\u6309\u94ae"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    fullscreen: true,\n});\n")),(0,r.kt)("h2",{id:"fullscreenweb"},"fullscreenWeb"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u5e95\u90e8\u63a7\u5236\u680f\u91cc\u663e\u793a\u64ad\u653e\u5668\u7f51\u9875\u5168\u5c4f\u6309\u94ae"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    fullscreenWeb: true,\n});\n")),(0,r.kt)("h2",{id:"subtitleoffset"},"subtitleOffset"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u5b57\u5e55\u65f6\u95f4\u504f\u79fb\uff0c\u8303\u56f4\u5728 ",(0,r.kt)("inlineCode",{parentName:"p"},"[-5s, 5s]")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    subtitle: {\n        url: '/assets/sample/subtitle.srt',\n    },\n    setting: true,\n    subtitleOffset: true,\n});\n")),(0,r.kt)("h2",{id:"miniprogressbar"},"miniProgressBar"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u8ff7\u4f60\u8fdb\u5ea6\u6761\uff0c\u53ea\u5728\u64ad\u653e\u5668\u5931\u53bb\u7126\u70b9\u540e\u4e14\u6b63\u5728\u64ad\u653e\u65f6\u51fa\u73b0"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    miniProgressBar: true,\n});\n")),(0,r.kt)("h2",{id:"localvideo"},"localVideo"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u6253\u5f00\u672c\u5730\u89c6\u9891\uff0c\u9700\u8981\u4f7f\u7528",(0,r.kt)("inlineCode",{parentName:"p"},"art.plugins.localVideo.attach"),"\u65b9\u6cd5\u6302\u8f7d\u6253\u5f00\u89c6\u9891\u6309\u94ae"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    localVideo: true,\n    controls: [\n        {\n            name: 'preview',\n            position: 'right',\n            html: '\u6253\u5f00\u89c6\u9891',\n            mounted: ($preview) => {\n                art.plugins.localVideo.attach($preview);\n            },\n        },\n    ],\n});\n")),(0,r.kt)("h2",{id:"localsubtitle"},"localSubtitle"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u6253\u5f00\u672c\u5730\u5b57\u5e55\uff0c\u9700\u8981\u4f7f\u7528",(0,r.kt)("inlineCode",{parentName:"p"},"art.plugins.localSubtitle.attach"),"\u65b9\u6cd5\u6302\u8f7d\u6253\u5f00\u5b57\u5e55\u6309\u94ae"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    localSubtitle: true,\n    controls: [\n        {\n            name: 'preview',\n            position: 'right',\n            html: '\u6253\u5f00\u5b57\u5e55',\n            mounted: ($preview) => {\n                art.plugins.localSubtitle.attach($preview);\n            },\n        },\n    ],\n});\n")),(0,r.kt)("h2",{id:"usessr"},"useSSR"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u4f7f\u7528 ",(0,r.kt)("inlineCode",{parentName:"p"},"SSR")," \u6302\u8f7d\u6a21\u5f0f\uff0c\u5047\u5982\u4f60\u5e0c\u671b\u5728\u64ad\u653e\u5668\u6302\u8f7d\u524d\uff0c\u5c31\u63d0\u524d\u6e32\u67d3\u597d\u64ad\u653e\u5668\u6240\u9700\u7684",(0,r.kt)("inlineCode",{parentName:"p"},"HTML"),"\u65f6\u6709\u7528"),(0,r.kt)("p",null,"\u4f60\u53ef\u4ee5\u901a\u8fc7",(0,r.kt)("inlineCode",{parentName:"p"},"Artplayer.html"),"\u8bbf\u95ee\u5230\u64ad\u653e\u5668\u6240\u9700\u7684",(0,r.kt)("inlineCode",{parentName:"p"},"HTML")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var $container = document.querySelector('.artplayer-app');\n$container.innerHTML = Artplayer.html;\n\nvar art = new Artplayer({\n    container: $container,\n    url: '/assets/sample/video.mp4',\n    useSSR: true,\n});\n")),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"SSR \u662f Server Side Render \u7b80\u79f0\uff0c\u9875\u9762\u4e0a\u7684\u5185\u5bb9\u662f\u901a\u8fc7\u670d\u52a1\u7aef\u6e32\u67d3\u751f\u6210\u7684\uff0c\u6d4f\u89c8\u5668\u76f4\u63a5\u663e\u793a\u670d\u52a1\u7aef\u8fd4\u56de\u7684 HTML \u5c31\u53ef\u4ee5\u4e86\u3002"))),(0,r.kt)("h2",{id:"layers"},"layers"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u7684\u4e1a\u52a1\u56fe\u5c42"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"disable")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Boolean")),(0,r.kt)("td",{parentName:"tr",align:null},"\u662f\u5426\u7981\u7528\u7ec4\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"name")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u552f\u4e00\u540d\u79f0\uff0c\u7528\u4e8e\u6807\u8bb0\u7c7b\u540d")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"index")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7d22\u5f15\uff0c\u7528\u4e8e\u663e\u793a\u7684\u4f18\u5148\u7ea7")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"html")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String"),"\u3001",(0,r.kt)("inlineCode",{parentName:"td"},"Element")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684 DOM \u5143\u7d20")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"style")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Object")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6837\u5f0f\u5bf9\u8c61")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"click")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u70b9\u51fb\u4e8b\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"mounted")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6302\u8f7d\u540e\u89e6\u53d1")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"tooltip")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684\u63d0\u793a\u6587\u672c")))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var img = '/assets/sample/layer.png';\nvar art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    layers: [\n        {\n            index: 1,\n            name: 'potser',\n            disable: false,\n            html: `<img style=\"width: 100px\" src=\"${img}\">`,\n            style: {\n                position: 'absolute',\n                top: '20px',\n                right: '20px',\n                opacity: '.9',\n            },\n            click: function (...args) {\n                console.info('\u4f60\u70b9\u51fb\u4e86\u7ec4\u4ef6');\n                art.layers.show = false;\n            },\n            mounted: function (...args) {\n                console.info('\u7ec4\u4ef6\u6302\u8f7d\u5b8c\u6210');\n            },\n        },\n    ],\n});\n")),(0,r.kt)("h2",{id:"settings"},"settings"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u7684\u8bbe\u7f6e\u9762\u677f"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"disable")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Boolean")),(0,r.kt)("td",{parentName:"tr",align:null},"\u662f\u5426\u7981\u7528\u7ec4\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"name")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u552f\u4e00\u540d\u79f0\uff0c\u7528\u4e8e\u6807\u8bb0\u7c7b\u540d")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"index")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7d22\u5f15\uff0c\u7528\u4e8e\u663e\u793a\u7684\u4f18\u5148\u7ea7")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"html")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String"),"\u3001",(0,r.kt)("inlineCode",{parentName:"td"},"Element")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684 DOM \u5143\u7d20")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"style")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Object")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6837\u5f0f\u5bf9\u8c61")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"click")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u70b9\u51fb\u4e8b\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"mounted")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6302\u8f7d\u540e\u89e6\u53d1")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"tooltip")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684\u63d0\u793a\u6587\u672c")))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    setting: true,\n    settings: [\n        {\n            disable: false,\n            name: 'button',\n            index: 10,\n            html: '\u81ea\u5b9a\u4e49\u6309\u94ae',\n            tooltip: '\u81ea\u5b9a\u4e49\u6309\u94ae\u7684\u63d0\u793a1',\n            style: {\n                color: 'red',\n            },\n            click: function () {\n                console.log('\u4f60\u70b9\u51fb\u4e86\u81ea\u5b9a\u4e49\u6309\u94ae1');\n            },\n            mounted: function () {\n                console.log('\u81ea\u5b9a\u4e49\u6309\u94ae\u6302\u8f7d\u5b8c\u62101');\n            },\n        },\n        {\n            html: '\u81ea\u5b9a\u4e49\u6309\u94ae2',\n            tooltip: '\u81ea\u5b9a\u4e49\u6309\u94ae\u7684\u63d0\u793a2',\n            style: {\n                color: 'green',\n            },\n            click: function () {\n                console.log('\u4f60\u70b9\u51fb\u4e86\u81ea\u5b9a\u4e49\u6309\u94ae2');\n            },\n        },\n    ],\n});\n")),(0,r.kt)("h2",{id:"contextmenu"},"contextmenu"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u7684\u53f3\u952e\u83dc\u5355"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"disable")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Boolean")),(0,r.kt)("td",{parentName:"tr",align:null},"\u662f\u5426\u7981\u7528\u7ec4\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"name")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u552f\u4e00\u540d\u79f0\uff0c\u7528\u4e8e\u6807\u8bb0\u7c7b\u540d")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"index")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7d22\u5f15\uff0c\u7528\u4e8e\u663e\u793a\u7684\u4f18\u5148\u7ea7")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"html")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String"),"\u3001",(0,r.kt)("inlineCode",{parentName:"td"},"Element")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684 DOM \u5143\u7d20")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"style")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Object")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6837\u5f0f\u5bf9\u8c61")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"click")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u70b9\u51fb\u4e8b\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"mounted")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6302\u8f7d\u540e\u89e6\u53d1")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"tooltip")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684\u63d0\u793a\u6587\u672c")))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    contextmenu: [\n        {\n            html: '\u81ea\u5b9a\u4e49\u83dc\u5355',\n            click: function () {\n                console.info('\u4f60\u70b9\u51fb\u4e86\u81ea\u5b9a\u4e49\u83dc\u5355');\n                art.contextmenu.show = false;\n            },\n        },\n    ],\n});\n\nart.on('ready', () => {\n    art.contextmenu.show = true;\n});\n")),(0,r.kt)("h2",{id:"controls"},"controls"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u7684\u5e95\u90e8\u63a7\u5236\u680f"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"disable")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Boolean")),(0,r.kt)("td",{parentName:"tr",align:null},"\u662f\u5426\u7981\u7528\u7ec4\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"name")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u552f\u4e00\u540d\u79f0\uff0c\u7528\u4e8e\u6807\u8bb0\u7c7b\u540d")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"index")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7d22\u5f15\uff0c\u7528\u4e8e\u663e\u793a\u7684\u4f18\u5148\u7ea7")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"html")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String"),"\u3001",(0,r.kt)("inlineCode",{parentName:"td"},"Element")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684 DOM \u5143\u7d20")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"style")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Object")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6837\u5f0f\u5bf9\u8c61")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"click")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u70b9\u51fb\u4e8b\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"mounted")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6302\u8f7d\u540e\u89e6\u53d1")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"tooltip")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684\u63d0\u793a\u6587\u672c")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"position")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u4f4d\u7f6e\u5728 ",(0,r.kt)("inlineCode",{parentName:"td"},"left")," \u6216\u8005 ",(0,r.kt)("inlineCode",{parentName:"td"},"right"))))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    controls: [\n        {\n            disable: false,\n            name: 'button',\n            index: 10,\n            position: 'right',\n            html: '\u81ea\u5b9a\u4e49\u6309\u94ae',\n            tooltip: '\u81ea\u5b9a\u4e49\u6309\u94ae\u7684\u63d0\u793a1',\n            style: {\n                color: 'red',\n            },\n            click: function () {\n                console.log('\u4f60\u70b9\u51fb\u4e86\u81ea\u5b9a\u4e49\u6309\u94ae1');\n            },\n            mounted: function () {\n                console.log('\u81ea\u5b9a\u4e49\u6309\u94ae\u6302\u8f7d\u5b8c\u62101');\n            },\n        },\n        {\n            position: 'left',\n            html: '\u81ea\u5b9a\u4e49\u6309\u94ae2',\n            tooltip: '\u81ea\u5b9a\u4e49\u6309\u94ae\u7684\u63d0\u793a2',\n            style: {\n                color: 'green',\n            },\n            click: function () {\n                console.log('\u4f60\u70b9\u51fb\u4e86\u81ea\u5b9a\u4e49\u6309\u94ae2');\n            },\n        },\n    ],\n});\n")),(0,r.kt)("h2",{id:"quality"},"quality"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u5e95\u90e8\u63a7\u5236\u680f\u91cc\u663e\u793a\u753b\u8d28\u9009\u62e9\u5217\u8868"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"default")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Boolean")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9ed8\u8ba4\u753b\u8d28")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"name")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u753b\u8d28\u540d\u5b57")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"url")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u753b\u8d28\u5730\u5740")))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    quality: [\n        {\n            default: true,\n            html: 'SD 480P',\n            url: '/assets/sample/video.mp4',\n        },\n        {\n            html: 'HD 720P',\n            url: '/assets/sample/video.mp4',\n        },\n    ],\n});\n")),(0,r.kt)("h2",{id:"highlight"},"highlight"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u5728\u8fdb\u5ea6\u6761\u4e0a\u663e\u793a\u9ad8\u4eae\u4fe1\u606f\u70b9"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"time")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9ad8\u4eae\u65f6\u95f4\uff08\u5355\u4f4d\u79d2\uff09")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"text")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9ad8\u4eae\u6587\u672c")))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    highlight: [\n        {\n            time: 60,\n            text: 'One more chance',\n        },\n        {\n            time: 120,\n            text: '\u8c01\u3067\u3082\u3044\u3044\u306f\u305a\u306a\u306e\u306b',\n        },\n        {\n            time: 180,\n            text: '\u590f\u306e\u60f3\u3044\u51fa\u304c\u307e\u308f\u308b',\n        },\n        {\n            time: 240,\n            text: '\u3053\u3093\u306a\u3068\u3053\u306b\u3042\u308b\u306f\u305a\u3082\u306a\u3044\u306e\u306b',\n        },\n        {\n            time: 300,\n            text: '\uff0d\uff0d\u7ec8\u308f\u308a\uff0d\uff0d',\n        },\n    ],\n});\n")),(0,r.kt)("h2",{id:"plugins"},"plugins"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u7684\u63d2\u4ef6"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"function myPlugin(art) {\n    console.info('\u4f60\u53ef\u4ee5\u5728\u63d2\u4ef6\u91cc\u8bbf\u95ee\u5230\u64ad\u653e\u5668\u7684\u5b9e\u4f8b');\n    return {\n        name: 'myPlugin',\n        something: '\u81ea\u5b9a\u4e49\u5bfc\u51fa\u7684\u5c5e\u6027',\n        doSomething: function () {\n            console.info('\u81ea\u5b9a\u4e49\u5bfc\u51fa\u7684\u65b9\u6cd5');\n        },\n    };\n}\n\nvar art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    plugins: [myPlugin],\n});\n\nart.on('ready', () => {\n    console.info(art.plugins.myPlugin.something);\n    console.info(art.plugins.myPlugin.doSomething());\n});\n")),(0,r.kt)("h2",{id:"whitelist"},"whitelist"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u56e0\u4e3a\u4e0d\u540c\u7684\u79fb\u52a8\u8bbe\u5907\u5b58\u5728\u591a\u79cd\u5dee\u5f02\u548c\u9650\u5236\uff0c\u6240\u4ee5\u672c\u64ad\u653e\u5668\u9ed8\u8ba4\u5728\u79fb\u52a8\u8bbe\u5907\u4e0a\u4f7f\u7528\u539f\u751f\u65b9\u6cd5\u6302\u8f7d\u89c6\u9891\uff0c\u5047\u5982\u4f60\u60f3\u5728\u79fb\u52a8\u8bbe\u5907\u4e0a\u4f7f\u7528\u672c\u64ad\u653e\u5668\uff0c\u9700\u8981\u624b\u52a8\u5f00\u542f\u767d\u540d\u5355"),(0,r.kt)("p",null,"\u767d\u540d\u5355\u662f\u4e00\u4e2a\u6570\u7ec4\u7c7b\u578b\uff0c\u5206\u522b\u4e0e ",(0,r.kt)("inlineCode",{parentName:"p"},"window.navigator.userAgent")," \u8fdb\u884c\u5339\u914d\uff0c\u53ea\u8981\u5176\u4e2d\u4e00\u9879\u5339\u914d\u6210\u529f\u5219\u542f\u7528\u64ad\u653e\u5668"),(0,r.kt)("p",null,"\u652f\u6301",(0,r.kt)("inlineCode",{parentName:"p"},"\u5b57\u7b26\u4e32"),"\u5339\u914d\u3001",(0,r.kt)("inlineCode",{parentName:"p"},"\u51fd\u6570"),"\u5339\u914d\u3001",(0,r.kt)("inlineCode",{parentName:"p"},"\u6b63\u5219"),"\u5339\u914d"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    whitelist: ['iPhone OS 11'],\n    // whitelist: ['*'],\n    // whitelist: [(ua) => /iPhone OS 11/gi.test(ua)],\n    // whitelist: [/iPhone OS 11/gi],\n    \n});\n")),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"\u5047\u5982\u5e0c\u671b\u5168\u90e8\u7c7b\u578b\u7684\u79fb\u52a8\u8bbe\u5907\u90fd\u542f\u7528\u64ad\u653e\u5668\uff0c\u8bbe\u7f6e ",(0,r.kt)("inlineCode",{parentName:"p"},"whitelist")," \u4e3a\u901a\u914d\u7b26 ",(0,r.kt)("inlineCode",{parentName:"p"},"['*']")," \u5373\u53ef"))),(0,r.kt)("h2",{id:"thumbnails"},"thumbnails"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Object")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"{}"))),(0,r.kt)("p",null,"\u5728\u8fdb\u5ea6\u6761\u4e0a\u8bbe\u7f6e\u9884\u89c8\u56fe"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"url")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9884\u89c8\u56fe\u5730\u5740")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"number")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9884\u89c8\u56fe\u6570\u91cf")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"width")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9884\u89c8\u56fe\u5bbd\u5ea6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"height")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9884\u89c8\u56fe\u9ad8\u5ea6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"column")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9884\u89c8\u56fe\u5217\u6570")))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    thumbnails: {\n        url: '/assets/sample/thumbnails.png',\n        number: 100,\n        width: 160,\n        height: 90,\n        column: 10,\n    },\n});\n")),(0,r.kt)("h2",{id:"subtitle"},"subtitle"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Object")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"{}"))),(0,r.kt)("p",null,"\u8bbe\u7f6e\u89c6\u9891\u7684\u5b57\u5e55\uff0c\u652f\u6301\u5b57\u5e55\u683c\u5f0f\uff1a",(0,r.kt)("inlineCode",{parentName:"p"},"vtt"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},"srt"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},"ass")),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"url")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5b57\u5e55\u5730\u5740")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"style")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Object")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5b57\u5e55\u6837\u5f0f")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"encoding")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5b57\u5e55\u7f16\u7801\uff0c\u9ed8\u8ba4 ",(0,r.kt)("inlineCode",{parentName:"td"},"utf-8"))),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"bilingual")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Boolean")),(0,r.kt)("td",{parentName:"tr",align:null},"\u662f\u5426\u53cc\u5b57\u5e55\u6837\u5f0f\uff0c\u901a\u8fc7\u6362\u884c\u533a\u5206")))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    subtitle: {\n        url: '/assets/sample/subtitle.srt',\n        encoding: 'utf-8',\n        bilingual: true,\n        style: {\n            color: '#03A9F4',\n            'font-size': '30px',\n        },\n    },\n});\n")),(0,r.kt)("h2",{id:"morevideoattr"},"moreVideoAttr"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Object")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"{'controls': false,'preload': 'metadata'}"))),(0,r.kt)("p",null,"\u66f4\u591a\u89c6\u9891\u5c5e\u6027\uff0c\u8fd9\u4e9b\u5c5e\u6027\u5c06\u76f4\u63a5\u5199\u5165\u89c6\u9891\u5143\u7d20\u91cc"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    moreVideoAttr: {\n        'webkit-playsinline': true,\n        playsInline: true,\n    },\n});\n")),(0,r.kt)("h2",{id:"icons"},"icons"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Object")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"{}"))),(0,r.kt)("p",null,"\u7528\u4e8e\u66ff\u6362\u9ed8\u8ba4\u56fe\u6807\uff0c\u652f\u6301 ",(0,r.kt)("inlineCode",{parentName:"p"},"Html")," \u5b57\u7b26\u4e32"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    icons: {\n        loading: '<img src=\"/assets/img/ploading.gif\">',\n        state: '<img src=\"/assets/img/state.png\">',\n        play: '',\n        pause: '',\n        volume: '',\n        volumeClose: '',\n        subtitle: '',\n        screenshot: '',\n        setting: '',\n        fullscreen: '',\n        fullscreenWeb: '',\n        pip: '',\n    },\n});\n")),(0,r.kt)("h2",{id:"type"},"type"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"''"))),(0,r.kt)("p",null,"\u7528\u4e8e\u6307\u660e\u89c6\u9891\u7684\u683c\u5f0f\uff0c\u9700\u8981\u914d\u5408 ",(0,r.kt)("inlineCode",{parentName:"p"},"customType")," \u4e00\u8d77\u4f7f\u7528\uff0c\u66f4\u591a\u4fe1\u606f\u8bf7\u8bbf\u95ee ",(0,r.kt)("a",{parentName:"p",href:"/document/zh-cn/libraries"},"\u7b2c\u4e09\u65b9\u5e93")),(0,r.kt)("p",null,"\u9ed8\u8ba4\u89c6\u9891\u7684\u683c\u5f0f\u5c31\u662f\u89c6\u9891\u5730\u5740\u7684\u540e\u7f00\uff08\u5982 ",(0,r.kt)("inlineCode",{parentName:"p"},".flv"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},".mkv"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},".ts"),"\uff09\uff0c\u4f46\u6709\u65f6\u5019\u89c6\u9891\u5730\u5730\u5740\u6ca1\u6709\u6b63\u786e\u7684\u540e\u7f00\uff0c\u6240\u4ee5\u9700\u8981\u7279\u522b\u6307\u660e"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.flv',\n    type: 'flv',\n});\n")),(0,r.kt)("h2",{id:"customtype"},"customType"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Object")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"{}"))),(0,r.kt)("p",null,"\u901a\u8fc7\u89c6\u9891\u7684\u683c\u5f0f\u8fdb\u884c\u5339\u914d\uff0c\u628a\u89c6\u9891\u89e3\u7801\u6743\u4ea4\u7ed9\u7b2c\u4e09\u65b9\u7a0b\u5e8f\u8fdb\u884c\u5904\u7406\uff0c\u66f4\u591a\u4fe1\u606f\u8bf7\u8bbf\u95ee ",(0,r.kt)("a",{parentName:"p",href:"/document/zh-cn/libraries"},"\u7b2c\u4e09\u65b9\u5e93")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.flv',\n    customType: {\n        flv: function (video, url, art) {\n            // video: \u89c6\u9891dom\u5143\u7d20\n            // url: \u89c6\u9891\u5730\u5740\n            // art: \u5f53\u524d\u5b9e\u4f8b\n        },\n    },\n});\n")),(0,r.kt)("h2",{id:"lang"},"lang"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"navigator.language.toLowerCase()"))),(0,r.kt)("p",null,"\u9ed8\u8ba4\u663e\u793a\u8bed\u8a00\uff0c\u76ee\u524d\u652f\u6301\uff1a",(0,r.kt)("inlineCode",{parentName:"p"},"en"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},"zh-cn"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},"zh-tw")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n    container: '.artplayer-app',\n    url: '/assets/sample/video.mp4',\n    lang: 'en',\n});\n")))}k.isMDXComponent=!0}}]);