How to Copy Text to Clipboard in React Native?

Hello Dev’s Today now in this post i will show you How to Copy Text to Clipboard in React Native? Here I will help you to know an example of how to copy text to clipboard in react-native app. From here you’ll learn about react native copy to clipboard example. If you want to see an example of how we can create copy to clipboard in react native then i hope you are a right place. Here I’m going to show you about how to implement the copy to clipboard in react native.

Just need to follow the bellow step for how to use copy to clipboard in react native.

Let’s start and see the following example:

Step 1: Download Project

Now in the first step need to run the following command to create a project.

expo init ExampleApp

Step 2: Install and Setup

At First, we need to install them in our project:

expo install expo-clipboard

Step 3: App.js

Now in this step, we will open the App.js file and then put the code.

import React from 'react';
import { StyleSheet, View, Button,Text } from 'react-native';
import * as Clipboard from 'expo-clipboard';
import { TextInput } from 'react-native-paper';

const App = () => {
    const [copiedText, setCopiedText] = React.useState('');

    const copyToClipboard = async () => {
        await Clipboard.setStringAsync('Nicesnippets.com');
    };

    const fetchCopiedText = async () => {
        const text = await Clipboard.getStringAsync();
        setCopiedText(text);
    };

    return (
        <View style={styles.container}>
            <TextInput
                label='Enter Text'
                value={copiedText}
            />
            <View style={styles.buttonContainer}>
                <Button title="Click here to copy to Clipboard" onPress={copyToClipboard} />
            </View>
            <View style={styles.buttonContainer}>
                <Button title="View copied text" onPress={fetchCopiedText} />
            </View>
        </View>
    );
}

const styles = StyleSheet.create({
    container: {
        paddingTop: 50,
        paddingHorizontal: 20,
    },
    buttonContainer: {
        marginTop:10,
    },
});

export default App;

Run Project

Now in the last step need to run our project by using the below command.

expo start

Read Also :How to Replace \n with br in PHP?

Thanks for read. I hope it help you. For more you can follow us on facebook