以下使用vue和vue-clipboard复制到剪贴板的代码有什么问题?
<button v-clipboard:copy="message">Copy</button>
data: {
message:"text to copy"
}
});
https://jsfiddle.net/29zhwcdf/2/
数据未复制到剪贴板。
答案 0 :(得分:1)
在实例化Vue应用程序之前,请确保使用:Vue.use(vueClipboards
)。
工作示例:
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>