React Native之Clipboard 复制文本

最新推荐文章于 2024-08-22 08:36:07 发布

jhonjson

最新推荐文章于 2024-08-22 08:36:07 发布

阅读量987

点赞数

CC 4.0 BY-SA版权

分类专栏： React Native基础文章标签： React Native之Clipboard

本文链接：https://blog.youkuaiyun.com/github_34402358/article/details/88568132

React Native基础专栏收录该内容

13 篇文章

订阅专栏

本文介绍了一个使用React Native实现的简单复制内容功能的组件。该组件通过Clipboard API实现了文本复制到系统剪贴板的功能，并提供了按钮点击事件来触发复制操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

import React, { Component } from 'react';
import {
  Text,
  Clipboard,
  View,
  TouchableOpacity,
} from 'react-native';


export default class CopyContent extends Component {

  constructor(props) {
    super(props);
    this.state = {
      copyStr: '我是复制内容'
    }
  }

  async copyContent() {
    const { copyStr } = this.state;
    Clipboard.setString(copyStr);
    let str = await Clipboard.getString();
    console.warn(str);
  }

  render() {
    const { copyStr } = this.state;
    return (
      <View>
        <Text style={{ fontSize: 26 }}>{copyStr} </Text>
        <TouchableOpacity
            onPress={this.copyContent.bind(this)}
          >
        <Text style={{ fontSize: 26 }}>复制 </Text>
        </TouchableOpacity>
      </View>
    );
  }
}

练习项目