So legen Sie den Wert eines Erweiterungseingabefelds in der Chrome-Inspektionskonsole fest
P粉685757239
P粉685757239 2023-08-31 21:02:14
0
1
461
<p> Ich versuche, den Wert eines erweiterten Eingabefelds auf der Inspektionskonsole festzulegen. Es sieht so aus, als wäre der Wert festgelegt, aber der Wert ist „Keine“. </p> <pre class="brush:php;toolbar:false;">var inputbox = document.querySelector('.state-styles'); inputbox.value = "blablablabla";</pre> <p>Der Wert des Eingabefelds ändert sich jedoch nicht für das untersuchte Element. Das ist weit hergeholt. Ich denke, die Skalierung erfolgt durch Reagieren. Wenn das OnChange-Ereignis eintritt, ändert sich der Eingabewert. Ich glaube schon. Wie stelle ich diesen Wert ein? ? ? Bitte hilf mir. </p> <p>Ich würde gerne wissen, wie man den Wert eines Eingabefelds in einer Erweiterung festlegt. </p>
P粉685757239
P粉685757239

Antworte allen(1)
P粉469090753

在 React.js 中,使用 querySelector 等方法直接操作 DOM 并设置输入元素的值可能无法反映 DOM 中的预期更改。这是因为 React 有自己的虚拟 DOM (VDOM),它可以用来有效地更新实际 DOM。

React 鼓励您管理组件的状态,并让 React 为您处理 DOM 的更新,而不是直接操作 DOM。以下是如何在 React 中实现所需行为的方法:

使用 useState 钩子声明一个状态变量:

import React, { useState } from 'react';

     function MyComponent() {
        const [inputValue, setInputValue] = useState('');

       // ...
     }

当你想改变输入框的值时,更新inputValue状态变量:

setInputValue("blablablabla");

使用 inputValue 状态变量渲染输入元素:

<input type="text" value={inputValue} onChange={e => 
                setInputValue(e.target.value)} />

通过这种方法,React 将管理输入元素的状态,并在状态更改时自动更新 DOM。

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage