vue 触发点击事件,实现代码拷贝

最新推荐文章于 2025-07-06 08:00:00 发布

原创最新推荐文章于 2025-07-06 08:00:00 发布 · 2.6k 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#触发点击事件，实现代码拷贝

收录于

事件触发专栏收录该内容

1 篇文章

订阅专栏

博客围绕触发点击事件来实现代码拷贝展开，虽无具体内容，但可知核心是利用点击事件达成代码拷贝功能，这在信息技术领域有一定应用场景，比如方便代码分享等。

<template>
    <div>
        <p class="grid" @click="copy(1)">222</p>
    </div>
</template>

<script>
export default {
    data() {
        return {

        }
    },
    methods: {
        copy(item){
            const input = document.createElement('input')
            document.body.appendChild(input)
            input.setAttribute('value',item)
            input.select()
            if (document.execCommand('copy')) {
                document.execCommand('copy')
                this.open2()
            }
            document.body.removeChild(input)
        },
        open2() {
            this.$message({
                message: '复制成功',
                type: 'success'
            });
        }
    },
}

</script>

<style>
.grid{
    width: 20px;
    height: 20px;
    background: #0f0;
}
</style>