前端性能优化,给录音播放的列表加个播放按键,点击之后再播放录音。减少页面的渲染录音文件数量过多导致加载缓慢

给录音播放的列表加个播放按键,点击之后再播放录音。减少页面的渲染录音文件数量过多导致加载缓慢

javascript 复制代码
 <ElTable.TableColumn
          align="center"
          label="录音音频播放"
          prop="recordLocationUrl"
          min-width="320"
        >
          <template #default="{ row }">
            <div v-if="row.isplay === true">
              <audio ref="audio" controls :src="row.recordLocationUrl" />
            </div>
            <ElButton
              v-else
              @click="clickaudio(row)"
              :disabled="row.recordLocationUrl ? false : true"
            >
              播放录音音频
            </ElButton>
          </template>
        </ElTable.TableColumn>


function clickaudio(elem: any) {
  elem.isplay = true;
}
相关推荐
二狗哈1 分钟前
Cesium快速入门30:CMZL动画
javascript·3d·webgl·cesium·地图可视化
良木生香2 分钟前
【诗句结构-初阶】详解栈和队列(2)---队列
c语言·数据结构·算法·蓝桥杯
yaoh.wang4 分钟前
力扣(LeetCode) 69: x 的平方根 - 解法思路
python·算法·leetcode·面试·职场和发展·牛顿法·二分法
!停5 分钟前
数据在内存中的存储(2)
开发语言·c++·算法
认真学GIS6 分钟前
逐3小时降水量!全国2421个气象站点1951-2024年逐3小时尺度长时间序列降水量(EXCEL格式)数据
人工智能·算法·机器学习
Huanzhi_Lin9 分钟前
禁用谷歌/google/chrome浏览器更新
前端·chrome
智航GIS10 分钟前
ArcGIS大师之路500技---039趋势面法
算法·arcgis
智航GIS11 分钟前
ArcGIS大师之路500技---038反距离权重法
算法·arcgis
咸鱼加辣13 分钟前
【前端的crud】DOM 就是前端里的“数据库”
前端·数据库
YGGP15 分钟前
【Golang】LeetCode 31. 下一个排列
算法·leetcode