这个需要用到三个事件
首先给按钮是绑定事件,需要给按钮绑定三个事件1.touchstart事件会在触摸按钮时触发,可以获取手指的初始坐标;2.touchmove事件在触摸后移动手指时触发,可以用来计算手手指的滑动距离;3.touchend事件在松开手指时候触发。
<button type="default" v-show="mode === 'voice'" @touchstart="handleTouchStart" @touchmove="handleTouchMove" @touchend="handleTouchEnd" >按住 说话</button>三个
const recorderManager = uni.getRecorderManager();
// 开始录制语音
handleTouchStart(e){
this.mask = true;
recorderManager.start();
this.length = 1;
this.startX = e.touches[0].pageX;
this.startY = e.touches[0].pageY;
this.timer = setInterval(() => {
this.length += 1;
if(this.length >= 60) {
clearInterval(this.timer);
this.handleTouchEnd()
}
},1000);
},
// 语音录制时滑动事件
handleTouchMove(e){
if(this.startX - e.touches[0].pageX > 14 && this.startY - e.touches[0].pageY > 50){
this.needCancel = true;
} else {
this.needCancel = false;
}
},
// 语音录制结束
handleTouchEnd(){
this.mask = false;
clearInterval(this.timer);
recorderManager.stop();
recorderManager.onStop((res) => {
const message = {
voice:res.tempFilePath,
length:this.length
};
if(!this.needCancel){
发送给对方,上传服务器
}
this.needCancel = false
});
}
1最后就是播放音频const innerAudioContext = uni.createInnerAudioContext();
// 播放语音
handleVoicePlay(item){
item.isFirstPlay = false;
innerAudioContext.src = item.message.voice;
this.isPlay = !this.isPlay;
this.isPlay ? innerAudioContext.play() : innerAudioContext.stop();
innerAudioContext.onEnded(() => {
this.isPlay = false;
})
innerAudioContext.onStop(() => {
this.isPlay = false;
})
}, 网友回复
如何让ai帮我自动在小红书或抖音上自动根据需求截流与潜在客户聊天拉客?
如果用go编写一个在virtualbox中启动的简单操作系统?
go如何搭建一个零信任网络?
如何用python实现一个公网代理访问软件?
如何用go实现一个公网代理访问软件?
如何用python实现一个内网穿透打洞程序,实现内网的80端口暴露到公网上可以访问?
如何用go实现一个内网穿透打洞程序,实现内网的80端口暴露到公网上可以访问?
何为Shadowsocks 代理?
python如何实现类似php的opendir目录相互隔离的fastcgi多租户虚拟空间?
nodejs如何实现类似php的opendir目录相互隔离的fastcgi多租户虚拟空间?


