uni-app api:使用剪贴板进行复制粘贴(hbuilderx 3.6.18)

一,代码:

<template>
    <view>
        <input class="btn" style="background: #ffff00;" type="text" v-model="content"/>
        <button class="btn" @click="setClipboard">复制到剪贴板</button>
        <button class="btn" style="margin-top: 20rpx;" @click="getClipboard">获取剪贴板内容</button>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                content:"海上升明月,天涯共此时",
            }
        },
        methods: {
            setClipboard(){
                uni.setClipboardData({
                    "data":this.content,
                    success:()=>{
                        uni.showToast({
                            title:"数据已复制到剪贴板",
                            icon:"none",
                        })
                    }
                })
            },
            
            getClipboard(){
                uni.getClipboardData({
                    success:(res)=>{
                        this.content = res.data;
                        uni.showToast({
                            title:this.content,
                            icon:"none",
                        })
                    }
                })
            },
        }
    }
</script>

<style>
.btn {
    width:710rpx;
    margin-left: 20rpx;
    margin-top: 20rpx;
}
</style>

说明:刘宏缔的架构森林是一个专注架构的博客,

网站:https://blog.imgtouch.com
原文: https://blog.imgtouch.com/index.php/2023/06/05/uniapp-api-shi-yong-jian-tie-ban-jin-xing-fu-zhi-zhan-tie/

         对应的源码可以访问这里获取: https://github.com/liuhongdi/
         或: https://gitee.com/liuhongdi

说明:作者:刘宏缔 邮箱: 371125307@qq.com

二,测试效果

三,查看hbuilderx的版本: 

posted @ 2023-02-19 19:18  刘宏缔的架构森林  阅读(636)  评论(0编辑  收藏  举报