Копирование в буфер обмена с помощью vuejs2 - PullRequest
1 голос
/ 19 мая 2019

Что не так с кодом ниже для копирования в буфер обмена с использованием vue и vue-clipboard?

<button v-clipboard:copy="message">Copy</button>

data: {
 message:"text to copy"
}

});

https://jsfiddle.net/29zhwcdf/2/

Данные не копируются в буфер обмена.

1 Ответ

1 голос
/ 19 мая 2019

Обязательно используйте: Vue.use (vueClipboards) , прежде чем создавать экземпляр приложения Vue.

Рабочий пример:

Vue.use(vueClipboards); // Add this before 'new Vue({..})'
var apptest = new Vue({
  el: "#apptest",
  data: {
    message: "text to copy"
  },
  methods: {
    handleSuccess(e) {
      console.log(e);
    },
    handleError(e) {
      console.log(e);
    },
  }
});
<!DOCTYPE html>
<html lang="en">

<head>
  <script src="https://cdn.jsdelivr.net/npm/vue"></script>
  <script src="https://cdn.jsdelivr.net/npm/vue-clipboards@1.2.4/dist/vue-clipboards.min.js"></script>
</head>

<body>
  <div id="apptest">
    <button v-clipboard="message" @success="handleSuccess" @error="handleError">Copy</button>
  </div>

</body>

</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...