vue 點擊複製文本

1.下載clipboard.js   

npm install clipboard --save 

2.引入，能夠在mian.js中全局引入也能夠在單個vue中引入

單頁面引用：
import Clipboard from "clipboard";

main.js中全局引入：

import Clipboard from 'clipboard'; 

Vue.prototype.Clipboard=Clipboard;

3.使用，:data-clipboard-text中即爲你要複製的內容

<div class="item">

   <span>收貨地址：</span>

   {{orderInfo.address.provinceName ||''}}{{orderInfo.address.districtName||'' }}{{orderInfo.address.address }}

    <el-button

    type="text"

    class="btn"

    :data-clipboard-text="orderInfo.address.address"

    @click="copy"

    >【複製】</el-button>

</div>

四、在methods中調用copy事件

methods: {

    copy: function() {

      var _this = this;

      var clipboard = new Clipboard(".btn"); //單頁面引用

　　　var clipboard = new this.Clipboard(".btn"); //在main.js中引用

      clipboard.on("success", e => {

        // 釋放內存

        clipboard.destroy();

      });

      clipboard.on("error", e => {

        // 不支持複製

        Message({

          message: "該瀏覽器不支持自動複製",

          type: "warning"

        });

        // 釋放內存

        clipboard.destroy();

      });

    },  　　

}