Merge pull request #2 from langyuxiansheng/dev_v1.1.6

更新优化局部引用方式
This commit is contained in:
langyuxiansheng 2019-12-27 11:00:18 +08:00 committed by GitHub
commit 50d3826dd2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 34 additions and 3 deletions

View File

@ -12,13 +12,41 @@ npm i vue-aliplayer-v2 --save
or or
yarn add vue-aliplayer-v2 yarn add vue-aliplayer-v2
``` ```
#### 全局注册 main.js
```javascript ```javascript
//全局注册 main.js
import VueAliplayerV2 from 'vue-aliplayer-v2'; import VueAliplayerV2 from 'vue-aliplayer-v2';
Vue.use(VueAliplayerV2); Vue.use(VueAliplayerV2);
``` ```
#### 局部注册 App.vue
```html
<template>
<div id="app">
<vue-aliplayer-v2
@ready="handleReady"
ref="VueAliplayerV2"
id="player-1194076936807171180"
:options="options" />
</div>
</template>
<script>
import VueAliplayerV2 from 'vue-aliplayer-v2';
export default {
data(){
return {
options: { //配置项
source:'rtmp://182.112.15.258:1688/hls/1194076936807171180'
}
}
},
components:{ VueAliplayerV2: VueAliplayerV2.Player }
}
</script>
```
## 2.组件中使用 ## 2.组件中使用
### 组件模板使用,但需要注意的是,假如你的页面中有多个播放器,那么这个id需要唯一!!,ID必传,只有一个的时候,可以忽略,命名只能是有效字符开头. 下面的视频连接是无效的,需要自己去替换成有效的. ### 组件模板使用,但需要注意的是,假如你的页面中有多个播放器,那么这个id需要唯一!!,ID必传,只有一个的时候,可以忽略,命名只能是有效字符开头. 下面的视频连接是无效的,需要自己去替换成有效的.
@ -313,6 +341,7 @@ npm run lint
``` ```
## 7.缺陷 & 后期计划 ## 7.缺陷 & 后期计划
> 2019年12月27日 更新优化局部引用方式
> 您有功能建议,或者bug反馈请留言. > 您有功能建议,或者bug反馈请留言.

View File

@ -14,7 +14,9 @@
</div> </div>
</template> </template>
<script> <script>
// import VueAliplayerV2 from '../packages';
export default { export default {
// components:{ VueAliplayerV2: VueAliplayerV2.Player },
data(){ data(){
return { return {
options: { options: {

View File

@ -1,6 +1,6 @@
{ {
"name": "vue-aliplayer-v2", "name": "vue-aliplayer-v2",
"version": "1.1.5", "version": "1.1.6",
"author": "yxs", "author": "yxs",
"description": "感谢每一位开源的开发者. 这是一个基于Alipayer 开发并封装成vue组件的播放器.", "description": "感谢每一位开源的开发者. 这是一个基于Alipayer 开发并封装成vue组件的播放器.",
"main":"lib/vue-aliplayer-v2.umd.min.js", "main":"lib/vue-aliplayer-v2.umd.min.js",

View File

@ -22,6 +22,6 @@ if (typeof window !== 'undefined' && window.Vue) {
export default { export default {
// 导出的对象必须具备一个 install 方法 // 导出的对象必须具备一个 install 方法
install, install,
VueAliplayerV2 Player: VueAliplayerV2
// 组件列表 // 组件列表
}; };