在谷歌瀏覽器是可以複製成功的,但在360安全瀏覽器(極速模式或兼容模式)複製不成功,瀏覽器都已更新到最新版本。 安裝: npm install vue-clipboard2 --save-dev 在main.js文件中: import Vue from 'vue'; //引入複製插件 import VueClipboard from 'vue-clipboard2'; Vue.use(VueClipboard);
此問題未解決,代碼如下:
- 在template標籤中(此爲循環創建的複製按鈕):
<el-button class="btn-common copy-video-btns" type="primary" size="small" @click="copyVideoUrl(props.$index,props.row)">
<span>複製地址</span>
</el-button>
//input不在循環創建中
<input type="text" v-model="copyVideoUrlCont" style="opacity: 0;">
- 在script標籤中:
data(){
return{
copyVideoUrlCont:''
}
},
methods:{
copyVideoUrl(index,row){
const thisObj = this;
//post請求,此爲自己封裝的
commonJs.commObj.httpPost(this,url,params,function (res) {
thisObj.copyVideoUrlCont='';
thisObj.$notify.closeAll();
if(res.data.result.resultCode == responseCode.SUCCESS_FULLY)){
if(res.data.livePlayUrl){
thisObj.copyVideoUrlCont = res.data.livePlayUrl;
thisObj.$copyText(thisObj.copyVideoUrlCont).then(function (e) {
console.log('已複製');
console.log(e);
},function (e) {
console.log('複製失敗');
console.log(e);
})
}
}
},function (error) {
commonJs.logger.debug(error);
})
}
注:https://www.npmjs.com/package/vue-clipboard2 (參考sample2)