React.js Clipboard.js Example to Copy Text to Clipboard From Input Field or Textarea Widget on Button Click in Browser Using TypeScript Full Project For Beginners




npm i copy-clipboard-js







import React, { Component } from "react";
import * as CCJ from "copy-clipboard-js";

export default class App extends Component {
  state = {
    text: ""

  constructor(props) {
    this.copy = this.copy.bind(this);
    this.onC = this.onC.bind(this);

  onC(e) {
    this.setState({ text: });

  copy() {
    CCJ.copyText(this.state.text, true);

  render() {
    return (
      <div className="App">
        <h1>Using copy-clipboard-js to copy text</h1>
          Write something and click copy, text will be copied to clipboard
        <input type="text" onChange={this.onC} />
        <button onClick={this.copy}>Copy</button>
        <a href="">
        <h5>"copy-clipboard-js": "^1.0.3"</h5>

Leave a Reply