nuevo en todos estos marcos modernos, estoy tratando de hacer que esta biblioteca de javascript funcione en mi componente Vue: https://clipboardjs.com
Puedo ver que está integrado en mi archivo public/js/app.js cuando se ejecuta Mix, pero parece que no puedo hacer referencia a él desde mi archivo .vue (componente)
¿Alguien puede darme una guía paso a paso sobre cómo hacer que esto se integre en mi proyecto, por favor?
archivo de recursos/js/app.js
import './clipboard';el archivo clipboard.js se encuentra en:
recursos/js/portapapeles.js
Mezcle el archivo webpack.mix.js:
mix.js("resources/js/app.js", "public/js") .js("resources/js/clipboard.js", "public/js") .vue() .postCss("resources/css/app.css", "public/css", [ require("tailwindcss"), ]);Componente My Vue (sección de método):
<script> export default { props: ['mediaDetails'], data() { return { } }, methods: { copyPassword() { alert("copy"); var password = document.getElementById('#password'); alert('1'); var clipboard = new ClipboardJS(password); alert('2'); } }la alerta ('2') nunca se dispara debido a que falla la asignación del portapapeles
webpack.mix.js , elimine la línea .js("resources/js/clipboard.js", "public/js")clipboard : npm install clipboard <script> import ClipboardJS from 'clipboard'; export default { props: ['mediaDetails'], data() { return { } }, methods: { copyPassword() { alert("copy"); var password = document.getElementById('#password'); alert('1'); var clipboard = new ClipboardJS(password); alert('2'); } }document.getElementById('#password') , debería ser document.getElementById('password')