Vue.js

vue.js 화면 drag & copy 막는 방법

무대포 개발자 2021. 1. 26. 20:17
728x90
반응형

vue.js 화면 drag 막는 방법

  • App.vue 는 main 화면이라고 생각하면 됨.
  • App.vue 에 아래와 같이 import 하면 전체 화면에서 사용할 수 있음.
App.vue (메인 뷰)

<style lang="scss">
@import "./sample";
</style>
Test.vue

<template>
  <div id="no-drag-test">
    <div class="nodrag"> 
      <div>Hello World</div>
    </div>
  </div>
</template>
sample.scss
.nodrag {
    -webkit-user-select: none;  
    -moz-user-select: none;  
    -ms-user-select: none;  
    -o-user-select: none;  
    user-select: none;
}

화면 copy, cut, paste 막는 방법

  • body, div 태그던 아래 명령어 넣어주면 됨.
    // example 1
<body oncopy="return false" oncut="return false" onpaste="return false">

// example 2