Vue3.0 vue-clipboard3的JavaScript的使用方法
原生JavaScript的使用方法:
<van-button round size="mini" @click="copy(inviteCode)" type="success">{{$t('Invitation.code')}}: {{ inviteCode }}</van-button>
import Clipboard from 'vue-clipboard3';
import { showToast } from 'vant'; // 引入相关插件
import 'vant/es/toast/style';
methods: {
// 复制
async copy (info) {
const { toClipboard } = Clipboard();
try {
await toClipboard(info);
showToast('复制成功')
} catch (e) {
showToast('复制失败')
}
},
}
Vue3.0的组合式api的使用方法
<van-button round size="mini" @click="copy(inviteCode)" type="success">{{$t('Invitation.code')}}: {{ inviteCode }}</van-button>
import Clipboard from 'vue-clipboard3';
import { showToast } from 'vant'; // 引入相关插件
import 'vant/es/toast/style';
setup() {
async function copyClick(info) {
const { toClipboard } = Clipboard();
try {
await toClipboard(info);
showToast('复制成功')
} catch (e) {
console.error(e);
showToast('复制失败')
}
}
return {
copyClick,
}
}