Trate o evento onPaste no React-Exemplos de código

Radu TM

Trate o evento onPaste no React

JavaScript por Radu TM June 16, 2022

import React, { useState } from 'react';

function App() {
  // Acompanhe o que foi colado no estado
  const [pastedText, setPastedText] = useState('');

  // Atualize o estado quando o usuário colar algo
  const handlePaste = e => {
    // Obtenha os dados da área de transferência
    const clipboardData = e.clipboardData || window.clipboardData;
    // Obtenha os dados colados como texto
    const pastedData = clipboardData.getData('text');
    // Atualize o estado com os dados colados
    setPastedText(pastedData);
  };

  return (
    <div>
      <h1>Trate o evento onPaste no React</h1>
      <textarea
        onPaste={handlePaste}
        placeholder="Cole algo aqui!"
      ></textarea>
      {/* Mostre apenas o texto colado quando houver algo para exibir */}
      {pastedText && <p>{pastedText}</p>}
    </div>
  );
}

export default App;

0

25.980

Trate o evento onPaste no React

JavaScript por Radu TM June 16, 2022

import React, { useState } from 'react';

function App() {
  const [text, setText] = useState('');

  function handlePaste(e) {
    // Obter dados da área de transferência
    const clipboardData = e.clipboardData || window.clipboardData;
    // Obter dados colados
    const pastedData = clipboardData.getData('Text');
    // Atualizar o estado
    setText(pastedData);
  }

  return (
    <div>
      <h1>Trate o evento onPaste no React</h1>
      <textarea
        value={text}
        onPaste={handlePaste}
      />
    </div>
  );
}

export default App;

0

25.980

Consultas relacionadas com JavaScript

Últimas consultas JavaScript

Explorar exemplos de código por categorias