vue複製到剪切板功能(vue-clipboard2)

寫在前面:爲何會是vue-clipboard2???由於剛寫的項目就用的這個啊,哈哈哈哈,我只好記下這個怎麼用了,至於clipboard,用法幾乎同樣,只是寫法不一樣罷了vue

  • 項目基礎 vue+webpackwebpack

  • 安裝web

    npm i vue-clipboard2 --save-dev
    複製代碼
  • 在main.js中引入vue-cli

    import VueClipboard from 'vue-clipboard2';
    
    Vue.use(VueClipboard)
    複製代碼
  • 使用npm

    methods:{
        copyText(){   //this.clidata是要複製的動態數據
            this.$copyText(this.clidata).then(()=> {
                console.log("複製成功"+this.clidata)
            },()=> {
                console.log("複製失敗了")
                }
            )}
        }
    複製代碼
  • 調用bash

    直接調用copyText()就好了ui


附項目代碼,功能是表格文本雙擊便可複製到剪切板this

columns:[
    {
        titel:"編號",
        key:"sys_order_no",
        render: (h, params) => {
            return h(
              "span",
              {
                on: {
                  dblclick: () => {
                    this.clidata = params.row.sys_order_no;
                    this.clifun();
                  }
                }
              },
              params.row.sys_order_no
            );
          }
    }
  ]
 
 
複製代碼
相關文章
相關標籤/搜索