首页 > 解决方案 > VueJS组件中的复制链接选项不起作用

问题描述

在我的 laravel/vue 应用程序中,我可以选择在用户单击图标时复制链接。

到目前为止,我的组件中有以下内容

 <a href="sample.site" class="text-dark" target="_blank" rel="noopener noreferrer" ref="mylink">
    <img class="social_icon"  @click="copyURL($refs.mylink)"
      src="/images/game/copy.png"
    /></a>
    <p>copied: {{ link }}</p>

我有以下内容

<script>
export default {
  
};
const app = new Vue({
    el: '#app',
    data() {
      return {
        link: ''
      }
    },
    methods: {
      copyURL(link) {
        this.link = link.href
      }
    }

})
</script>

但这不起作用或没有显示任何错误

标签: javascriptlaravelvue.jsvue-component

解决方案


您还没有调用该方法copyURL

<a :href="sample.site" @click="copyURL" ref="mylink">
  <img class="social_icon" src="/images/game/copy.png" />
</a>

推荐阅读