2015-09-28 5 views
8

Wenn ich ein Reactjs-Eingabetextelement mit onPaste-Ereignis zugewiesen habe, wie kann ich den eingefügten Wert in der Antwort abrufen?Wie wird ein Wert von Reactjs onPaste-Ereignis eingefügt?

Im Moment bekomme ich in der Konsole ein SyntheticClipboardEvent mit allen Eigenschaften als null. Ich habe gelesen, dass das console.log ein Async-Checker ist, weshalb die Mehrheit der Werte null ist, wenn sie nach vorne schauen.

Ich frage mich jedoch, wie man den Wert bekommt.

Prost

Antwort

16
onPaste: function(e) { 
    console.log(e.clipboardData.getData('Text')); 
}, 
+0

, wenn ich diese, es gibt mir mehr als einen Wert aus der Zwischenablage – PositiveGuy

0

die Daten können auf clipboardData und analysiert, um Zeichenfolge wie folgt gefunden werden:

event.clipboardData.items[0].getAsString(text=>{ 
    // do something 
}) 
2

Facebook Datatransfer-Modul zuerst umfassen:

var DataTransfer = require('fbjs/lib/DataTransfer'); 

dann können Sie tun:

onPaste: function (evt) { 
     var data = new DataTransfer(evt.clipboardData); 

     var text = data.getText(); 
     var html = data.getHTML(); 
     var files = data.getFiles(); 
}, 

Sie willkommen;)

2

https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/types

Die Formate Unicode-Strings sind die Art oder das Format der Daten, im Allgemeinen durch einen MIME-Typen geben gegeben. Einige Werte, die keine MIME-Typen sind, sind aus Legacy-Gründen (z. B. "Text").

Beispiel:

onPaste: function(e) { 
    console.log(e.clipboardData.getData('Text')); 
    console.log(e.clipboardData.getData('text/plain')); 
    console.log(e.clipboardData.getData('text/html')); 
    console.log(e.clipboardData.getData('text/rtf')); 

    console.log(e.clipboardData.getData('Url')); 
    console.log(e.clipboardData.getData('text/uri-list')); 
    console.log(e.clipboardData.getData('text/x-moz-url')); 
} 
Verwandte Themen