控制进度条不能拖动 如何设置参数少样式
时间: 2023-10-02 11:12:17 浏览: 58
如果你不想使用 CSS 样式来控制进度条不能拖动,你可以尝试在组件上添加 `@change` 事件监听器,然后在该事件监听器中检查当前是否可以拖动进度条,如果不可以,则将进度条的值设置为上一次的值,从而阻止进度条的拖动。具体的代码实现如下:
```html
<uni-audio-player
:src="audioSrc"
:disable-progress="true"
@change="handleChange"
></uni-audio-player>
```
```js
export default {
data() {
return {
audioSrc: 'http://example.com/audio.mp3',
canDragProgress: false,
lastValue: 0
}
},
methods: {
handleChange(e) {
if (!this.canDragProgress) {
this.$refs.player.setValue(this.lastValue)
} else {
this.lastValue = e.detail.value
}
}
}
}
```
在上面的代码中,我们在组件上添加了 `@change` 事件监听器,并在该监听器中检查了 `canDragProgress` 变量的值,如果为 `false`,则将进度条的值设置为上一次的值,从而阻止进度条的拖动。在组件中,我们还需要将 `canDragProgress` 的值设置为 `true` 或 `false`,以控制是否允许拖动进度条。当然,如果你使用的是自定义的音频或视频播放器组件,你需要根据组件的具体实现来修改上面的代码。