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

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

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;
}
相关推荐
数据大魔方7 分钟前
【期货量化实战】螺纹钢量化交易指南:品种特性与策略实战(TqSdk完整方案)
python·算法·github·程序员创富·期货程序化·期货量化·交易策略实战
XiaoYu20027 分钟前
第11章 LangChain
前端·javascript·langchain
霉运全滚蛋好运围着转34 分钟前
启动 Taro 4 项目报错:Error: The specified module could not be found.
前端
cxxcode37 分钟前
前端模块化发展
前端
千金裘换酒40 分钟前
LeetCode 删除链表的倒数第N个结点
算法·leetcode
不务正业的前端学徒42 分钟前
docker+nginx部署
前端
不务正业的前端学徒1 小时前
webpack/vite配置
前端
SweetCode1 小时前
【无标题】
开发语言·c++·算法
shughui1 小时前
Python基础面试题:语言定位+数据类型+核心操作+算法实战(含代码实例)
开发语言·python·算法
hhcccchh1 小时前
学习vue第八天 Vue3 模板语法和内置指令 - 简单入门
前端·vue.js·学习