Skip to content

文字复制组件

代码事例
vue
<template>
	<fk-space align="start" direction="vertical">
		<fk-space>
			<CopyText type="text">默认类型</CopyText>
		</fk-space>
        <fk-space>
			<CopyText class="hover" type="text" @click="handleClick">Hover展示复制按钮</CopyText>
		</fk-space>
        <fk-space>
			<CopyText type="button" @click="handleClick">按钮模式复制的文字</CopyText>
		</fk-space>
        <fk-space>
			<CopyText type="link" @click="handleClick">Link模式复制的文字</CopyText>
		</fk-space>
        <fk-space>
			<CopyText copy="单独一个图标" />
		</fk-space>
        <fk-space>
			<CopyText type="text" style="max-width:120px;">溢出展示省略点溢出展示省略点溢出展示省略点溢出展示省略点</CopyText>
		</fk-space>
        <fk-space>
			<CopyText type="button" style="max-width:120px;" @click="handleClick">溢出展示省略点溢出展示省略点溢出展示省略点溢出展示省略点</CopyText>
		</fk-space>
        <fk-space>
			<CopyText type="link" style="max-width:120px;" @click="handleClick">溢出展示省略点溢出展示省略点溢出展示省略点溢出展示省略点</CopyText>
		</fk-space>
        <fk-space>
			<CopyText type="text" copy="复制特殊字符" @click="handleClick">"复制特殊字符"复制特殊字符</CopyText>
		</fk-space>
	</fk-space>
	<fk-row>
		<JsonViewer :data="vm" />
	</fk-row>
</template>

<script lang="ts" setup>
import { reactive } from 'vue';
import { CopyText } from '@erp/biz';

const vm = reactive({

})

const handleClick = () => {

}
</script>

基于 MIT 许可发布