는 vuejs 2

Question

전체 코드를 발사하지 @onmouseup : https://github.com/kenpeter/test_vue_simple_audio_1

나는 input range에 @onmouseup를 연결합니다. 슬라이더를 끌면 progressChange이 호출되지 않은 것처럼 보입니다.

이 문제는 VueJS로 이벤트를 호출에 잘못된 이름이다 : 여기

<input 
    type="range" 
    :min="0" 
    :step="1" 
    v-model="current" 

    :value="current" 
    :max="duration" 
    @onmouseup="progressChange()" 
    /> 

은 유사한 문제를 찾고있을 것이다 사람들을위한 나중에 참조 할 수 있도록이 질문에 대답하려면 methods

methods: { 
    timeChange: function() { 
     this.current = this.$refs.player.currentTime; 
    }, 
    getDuration: function() { 
     this.duration = this.$refs.player.duration; 
    }, 
    toggleStatus: function() { 
     var player = this.$refs.player; 
     this.isPause ? player.play() : player.pause(); 
     this.isPause = !this.isPause; 
    }, 
    next: function() { 
     if (this.audioIndex == this.songs.length - 1) { 
     if (this.repeat) { 
      this.audioIndex = 0; 
     } 
     } else { 
     this.audioIndex++; 
     } 
    }, 
    prev: function() { 
     if (this.audioIndex == 0) { 
     if (this.repeat) { 
      this.audioIndex = this.songs.length - 1; 
     } 
     } else { 
     this.audioIndex--; 
     } 
    }, 
    progressChange() { 
     console.log("progress change"); 
    }, 

Answer 1

입니다 @even의 구문을 사용합니다. 즉, @이 'on'을 대체하므로 다음을 사용해야합니다.

• @mouseup
• @click
• @keyup : 키 이름
• @input @customEventEmitedByComponent 그것은이다