更新记录
1.0.0(2025-05-29)
下载此版本
首次上传
平台兼容性
uni-app
Vue2 |
Vue3 |
Chrome |
Safari |
app-vue |
app-nvue |
Android |
iOS |
鸿蒙 |
√ |
- |
- |
- |
- |
- |
- |
- |
- |
微信小程序 |
支付宝小程序 |
抖音小程序 |
百度小程序 |
快手小程序 |
京东小程序 |
鸿蒙元服务 |
QQ小程序 |
飞书小程序 |
快应用-华为 |
快应用-联盟 |
- |
- |
- |
- |
- |
- |
- |
- |
- |
- |
- |
属性说明
属性名 |
类型 |
默认值 |
说明 |
videoUrl |
String |
无 |
视频的 URL 地址,这是必须提供的参数 |
coverImage |
String |
无 |
视频封面图的 URL,默认值为空字符串 |
avatar |
String |
无 |
用户头像的 URL,默认值为空字符串 |
username |
String |
抖音用户 |
用户名称,默认值为 "抖音用户" |
description |
String |
这是一个抖音风格的视频 |
视频描述文字,默认值为 "这是一个抖音风格的视频" |
musicName |
String |
原创音乐 |
背景音乐名称 |
likeCount |
Number|String |
0 |
点赞数量 |
commentCount |
Number|String |
0 |
评论数量 |
shareCount |
Number|String |
0 |
分享数量 |
autoplay |
Boolean |
false |
是否自动播放 |
loop |
Boolean |
true |
是否循环播放 |
muted |
Boolean |
false |
是否静音播放 |
基础用法
<template>
<view class="container">
<naiyaVideo
:videoUrl="videoUrl"
:coverImage="coverImage"
:avatar="avatar"
:username="username"
:description="description"
:musicName="musicName"
:likeCount="likeCount"
:commentCount="commentCount"
:shareCount="shareCount"
:autoplay="true"
:loop="true"
:muted="false"
/>
</view>
</template>
<script>
export default {
data() {
return {
videoUrl: 'https://example.com/video.mp4',
coverImage: 'https://example.com/cover.jpg',
avatar: 'https://example.com/avatar.jpg',
username: '示例用户',
description: '这是一个示例视频描述',
musicName: '示例背景音乐',
likeCount: 12345,
commentCount: 678,
shareCount: 90
}
}
}
</script>