copy text using react js

Solutions on MaxInterview for copy text using react js by the best coders in the world

showing results for - "copy text using react js"
Leana
01 Mar 2018
1import React, { Component } from "react"
2
3export default class YourComponent extends Component {
4  constructor(props) {
5    super(props)
6
7    this.state = {
8      copySuccess: false
9    }
10  }
11
12  copyCodeToClipboard = () => {
13    const el = this.textArea
14    el.select()
15    document.execCommand("copy")
16    this.setState({copySuccess: true})
17  }
18
19  render() {
20    return (
21      <div>
22        <div>
23          <textarea
24            ref={(textarea) => this.textArea = textarea}
25            value="Example copy for the textarea."
26          />
27        </div>
28        <div>
29          <button onClick={() => this.copyCodeToClipboard()}>
30            Copy to Clipboard
31          </button>
32          {
33            this.state.copySuccess ?
34            <div style={{"color": "green"}}>
35              Success!
36            </div> : null
37          }
38        </div>
39      </div>
40    )
41  }
42}