小程序
<video
v-for="(item, index) in dataS" :key="index"
@play="handlePlay(item.id)"
:id="item.id"
style="width: 100%;height: 100%;"
:src="apiUrl + '/api' + item.websiteLink"
controls
></video>
const handlePlay = idV => {
let videoContext = uni.createVideoContext(idV, this);
videoContext.play();
dataS.value.map((item, index) => {
if (item.id != idV) {
let videoContext2 = uni.createVideoContext(item.id, this);
videoContext2.pause();
}
});
};
pc
<lay-form v-for="(item, index) in list" :key="index">
<div class="cardcontainer">
<div class="video">
<video
@play="handlePlay(index,item)"
style="width: 100%;height: 100%;"
:src="apiBaseUrl + '/api' + item.websiteLink"
controls
></video>
</div>
<div class="title">{{ item.websiteName }}</div>
<div class="foot">
<div class="peonum">{{ item.numberOfLearners }}人学习</div>
<div class="date">{{ item.createTime }}上传</div>
</div>
</div>
const videoElement = ref([]);
const handlePlay = (index, item) => {
const videoElementsArray = Array.from(videoElement.value);
if (videoElementsArray) {
videoElementsArray.forEach((video, i) =>
i === index ? video.play() : video.pause()
);
}
};