1

I have an input element with an onPaste event handler. When I paste a string of text (eg "A string I pasted") into the input the event gives me an empty string "" value:

<input onPaste={handleOnPaste} placeholder="paste image or url here"></input>

    function handleOnPaste(e) {
        const stringValue = e.target.value;
        console.log({ stringValue }); // logs ""
        console.dir({target: e.target}) // logs "A string I pasted". See image below
        console.dir({value: e.target.value}) // logs ""
    }

screenshot

  1. Why does console.dir(e.target) provide an object with a different value than console.dir(e.target.value).
  2. How do I access the value that contains a string in my javascript?
JimmyTheCode
  • 3,783
  • 7
  • 29
  • 71
  • 1
    `console.dir(e.target)` is printing stale data (call by reference) and `console.dir(e.target.value)` is printing actual data that was present at that moment of compiling.. – paragxviii Sep 27 '21 at 16:17
  • But the ```e.target``` value is a more up to date value than the ```e.target.value```. So it would be correct to say that the latter is the stale data I think? Do you know if it's possible to access the ```e.target``` (more up to date) value with javascript, or is it limited to the developer tools console? – JimmyTheCode Sep 28 '21 at 06:15

0 Answers0