React-Native项目中应用剪贴板复制粘贴操作

2019-11-09 13:56:02

字体：大中小

来源：转载

供稿：网友

前言

很多APP中都会用到剪贴板的操作，对于React-Native来讲同样也可以实现这个功能。

方法

Clipboard组件可以在iOS和Android的剪贴板中读写内容。

常用API

1.得到复制内容

static getString()

获取剪贴板的文本内容，返回一个PRomise你可以用下面的方式来调用。

async _getContent() { var content = await Clipboard.getString(); }

这里async和await为ES7的语法，变异步为同步。

2.拷贝内容到剪贴板

static setString(content: string)

设置剪贴板的文本内容。你可以用下面的方式来调用。

_setContent() { Clipboard.setString('hello world'); }

示例

'use strict';var React = require('react');var ReactNative = require('react-native');var { Clipboard, View, Text,} = ReactNative;var ClipboardExample = React.createClass({ getInitialState() { return { content: 'Content will appear here' }; }, async _setClipboardContent(){ Clipboard.setString('Hello World'); try { var content = await Clipboard.getString(); this.setState({content}); } catch (e) { this.setState({content:e.message}); } }, render() { return ( <View> <Text onPress={this._setClipboardContent} style={{color: 'blue'}}> Tap to put "Hello World" in the clipboard </Text> <Text style={{color: 'red', marginTop: 20}}> {this.state.content} </Text> </View> ); }});exports.title = 'Clipboard';exports.description = 'Show Clipboard contents.';exports.examples = [ { title: 'Clipboard.setString() and getString()', render() { return <ClipboardExample/>; } }];

注：此例子来源于官方示例，仅供参考学习！

上一篇：Dagger2学习笔记之Qualifier

下一篇：在npm上面发布自己的插件