반응형
VueJ에서 마우스 좌표를 얻는 방법s
다음 컴포넌트가 트리거되었습니다.v-on:click="someMethod".
이 클릭의 마우스 좌표(X, Y)는 어떻게 얻을 수 있습니까?
상세정보: HTML5 Canvas 컴포넌트
Vue가 통과하다event메서드의 첫 번째 매개 변수로 지정합니다.파라미터의 경우 대신 someMethod(param1, param2, event)를 사용합니다.
methods: {
someMethod(event) {
// clientX/Y gives the coordinates relative to the viewport in CSS pixels.
console.log(event.clientX);
console.log(event.clientY);
// pageX/Y gives the coordinates relative to the <html> element in CSS pixels.
console.log(event.pageX);
console.log(event.pageY);
// screenX/Y gives the coordinates relative to the screen in device pixels.
console.log(event.screenX);
console.log(event.screenY);
}
}
다른 이벤트 핸들러와 마찬가지로
new Vue({
el: '#element',
methods: {
someMethod: function (event) {
var x = event.pageX;
var y = event.pageY;
}
}
})
그리고 또clientX그리고.screenX뷰포트, 화면 또는 렌더링된 콘텐츠에 따라 다소 다른 결과가 반환됩니다.
언급URL : https://stackoverflow.com/questions/45553162/how-to-get-mouse-coordinates-in-vuejs
반응형
'source' 카테고리의 다른 글
| hashCode()를 덮어쓰는 객체의 고유 ID를 얻으려면 어떻게 해야 합니까? (0) | 2022.08.20 |
|---|---|
| vue2-google-maps를 사용할 때 정보 창을 구글 맵용 html로 채우려면 어떻게 해야 합니까? (0) | 2022.08.20 |
| 파일이 nuxt에 있는지 확인하는 방법 (0) | 2022.08.20 |
| Stringization - 어떻게 작동합니까? (0) | 2022.08.20 |
| Android에서 다른 응용 프로그램에서 작업을 시작하는 방법 (0) | 2022.08.20 |