mirror of
https://github.com/soybeanjs/soybean-admin.git
synced 2025-11-12 19:53:41 +08:00
feat(projects): 添加插件示例:剪贴板
This commit is contained in:
31
src/views/plugin/copy/index.vue
Normal file
31
src/views/plugin/copy/index.vue
Normal file
@@ -0,0 +1,31 @@
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { useClipboard } from '@vueuse/core';
|
||||
|
||||
const source = ref('');
|
||||
const { copy, isSupported } = useClipboard();
|
||||
|
||||
function handleCopy() {
|
||||
if (!isSupported) {
|
||||
window.$message?.error('您的浏览器不支持Clipboard API');
|
||||
return;
|
||||
}
|
||||
if (!source.value) {
|
||||
window.$message?.error('请输入要复制的内容');
|
||||
return;
|
||||
}
|
||||
copy(source.value);
|
||||
window.$message?.success(`复制成功:${source.value}`);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="h-full">
|
||||
<NCard title="文本复制" :bordered="false" class="h-full rounded-8px shadow-sm">
|
||||
<NInputGroup>
|
||||
<NInput v-model:value="source" placeholder="请输入要复制的内容吧" />
|
||||
<NButton type="primary" @click="handleCopy">复制</NButton>
|
||||
</NInputGroup>
|
||||
</NCard>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user