zoukankan      html  css  js  c++  java
  • vue项目如何实现剪切板功能--vue-clipboard2

    看了几篇文章,但是只感觉这个比较言简意赅。具体的可以去博客看一下www.nut666.com?from=bky

    1。

    先安装

    npm install --save vue-clipboard2 or use dist/vue-clipboard.min.js 

    2。

    如果是npm,检查package.json是否安装成功

    3。

    npm run dev  启动一下。

    4。

    main.js添加

    import Vue

    import VueClipboard from 'vue-clipboard2'

    Vue.use(VueClipboard)

    5。

    <template id="t">
      <div class="container">
        <input type="textv-model="message">
        <button type="button"
          v-clipboard:copy="message"
          v-clipboard:success="onCopy"
          v-clipboard:error="onError">Copy!</button>
      </div>
    </template>
    <script>
    new Vue({
      el'#app',
      template'#t',
      datafunction ({
        return {
          message'Copy These Text'
        }
      },
      methods{
        onCopyfunction (e{
          alert('You just copied: e.text)
        },
        onErrorfunction (e{
          alert('Failed to copy texts')
        }
      }
    })
    </script>
     
     
    也可以放问我的博客https://www.nut666.com
  • 相关阅读:
    编程之美--2.13
    编程之美--2.17
    编程之美--3.8
    编程之美--3.7
    面试金典--9.3
    面试金典--9.2
    面试金典--9.1
    jq插件
    laravel controller
    laravel 登录验证
  • 原文地址:https://www.cnblogs.com/mrnut/p/8631303.html
Copyright © 2011-2022 走看看