Kheys
2 266
modifications
« Fonctionnement technique de Jeuxvideo.com » : différence entre les versions
m
→Passage en React : camelCase
m (→Passage en React : camelCase) |
|||
| Ligne 248 : | Ligne 248 : | ||
Heureusement, il existe pour cela '''une fonction très utilisée''' sur le web : | Heureusement, il existe pour cela '''une fonction très utilisée''' sur le web : | ||
function | function fonctionReact(textarea, value) { | ||
const prototype = Object.getPrototypeOf(textarea); | const prototype = Object.getPrototypeOf(textarea); | ||
const nativeSetter = Object.getOwnPropertyDescriptor(prototype, 'value').set; | const nativeSetter = Object.getOwnPropertyDescriptor(prototype, 'value').set; | ||
| Ligne 257 : | Ligne 257 : | ||
Fonction de '''dernier recours''' (plus bas niveau : API DOM / Simule une vrai entrée clavier) '''à éviter''' ⚠️ sauf si la première méthode est bloquée : | Fonction de '''dernier recours''' (plus bas niveau : API DOM / Simule une vrai entrée clavier) '''à éviter''' ⚠️ sauf si la première méthode est bloquée : | ||
function | function fonctionReact(textarea, value) { | ||
textarea.setRangeText(value, 0, textarea.value.length, "end"); | textarea.setRangeText(value, 0, textarea.value.length, "end"); | ||
textarea.dispatchEvent(new Event("input", { bubbles: true })); | textarea.dispatchEvent(new Event("input", { bubbles: true })); | ||
| Ligne 264 : | Ligne 264 : | ||
Ensuite, il suffit simplement de faire appel à cette fonction quand on doit remplir une zone de texte : | Ensuite, il suffit simplement de faire appel à cette fonction quand on doit remplir une zone de texte : | ||
fonctionReact(messageTextArea, message); | |||
En 1er on donne la zone de texte ciblée et en 2nd le texte à insérer. | En 1er on donne la zone de texte ciblée et en 2nd le texte à insérer. | ||
Pour simplifier, <code><span style="color:red;">messageTextArea</span>.value = <span style="color:green;">message</span>;</code> devient <code> | Pour simplifier, <code><span style="color:red;">messageTextArea</span>.value = <span style="color:green;">message</span>;</code> devient <code>fonctionReact(<span style="color:red;">messageTextArea</span>, <span style="color:green;">message</span>);</code> avec cette fonction. | ||
=== Fonction officielle JVC === | === Fonction officielle JVC === | ||