百度智能小程序设置系统剪贴板的内容

2020-09-05 14:29 更新

swan.setClipboardData

解释：设置系统剪贴板的内容

Web 态说明：由于 Web 态环境安全策略限制，调用该 API 前必须要存在用户交互场景（点触），如果无用户交互场景下直接调用，会导致执行成功回调但实际功能未生效。因此建议在点击事件监听等用户交互场景下使用该 API。

方法参数

Object object

object 参数说明

属性名	类型	必填	说明
data	String	是	需要设置的内容
success	Function	否	接口调用成功的回调函数
fail	Function	否	接口调用失败的回调函数
complete	Function	否	接口调用结束的回调函数（调用成功、失败都会执行）

示例

图片示例

代码示例 1

在开发者工具中打开

<view class="wrap">
    <view class="card-area">
        <view class="list-area border-bottom">
            <text class="list-item-key-4">原文本</text>
            <text class="list-item-value">{{originData}}</text>
        </view>
        <view class="list-area border-bottom">
            <text class="list-item-key-4">复制文本</text>
            <text class="list-item-value">{{clipboardData}}</text>
        </view>
        <button bind:tap="setClipboardData" type="primary" hover-stop-propagation="true">复制</button>
        <button bind:tap="getClipboardData" type="primary" hover-stop-propagation="true">粘贴</button> 
    </view>
</view>

Page({
    data: {
        originData: 'baidu',
        clipboardData: '',
        medium: ''
    },
    setClipboardData() {
        let originData = this.data.originData;
        swan.setClipboardData({
            data: originData,
            success: res => {
                this.setData('medium', originData);
                swan.showToast({
                    title: '复制成功',
                    icon: 'none'
                });
            },
            fail: err => {
                swan.showToast({
                    title: '复制失败',
                    icon: 'none'
                });
                console.log('setClipboardData fail', err);
            }
        });
    },
    getClipboardData() {
        let medium = this.data.medium;
        if (medium === '') {
            swan.showToast({
                title: '请先复制',
                icon: 'none'
            });
            return;
        }

        swan.getClipboardData({
            success: res => {
                console.log('getClipboardData success');
                this.setData('clipboardData', medium);
            },
            fail: err => {
                console.log('getClipboardData fail', err);
            }
        });
    }
});

代码示例 2：此 api 可实现一键复制的业务场景

在开发者工具中打开

Page({
    data: {
        infoData: 'infoData'
    },
    onShow() {
        swan.request({
            url: 'https://xxx.com', // 仅为示例，并非真实的接口地址
            header: {
                'content-type': 'application/json'
            },
            method: 'POST',
            dataType: 'json',
            responseType: 'text',
            data: {
                key: 'value'
            },
            success: res => {
                this.setData('infoData', res.data)
            },
            fail: err => {
                console.log('错误码：' + err.errCode);
                console.log('错误信息：' + err.errMsg);
            }
        });
    },
    setClipboardData() {
        swan.setClipboardData({
            data: this.data.infoData,
            success: () => {
                swan.showToast({
                    title: '一键复制成功',
                    icon: 'none'
                });
            },
            fail: err => {
                swan.showToast({
                    title: '一键复制失败',
                    icon: 'none'
                });
                console.log('setClipboardData fail', err);
            }
        });
    }
});