Reactjs 如何克隆状态变量以用作react中的引用？

这是我找不到好答案的事情，但我解决了它；这就是问题所在：

如果不对焦，我想重置输入元素

type Props = {
    inputRef: any;
    value: string;
    setValue: Function;
}

const inputField = (props: Props) => {
    let tempValue = props.value;
    
    return(
        <input
            ref= {props.inputRef}
            onChange= {e => 
                props.setValue(e.target.value);
            }
            value= {props.value}
            onBlur={ () => {
                props.setValue(tempValue);
            }}
        />
    )
}

类型道具={
输入：任何；
值：字符串；
设置值：函数；
}
常量输入字段=（道具：道具）=>{
让tempValue=props.value；
返回(
道具设定值（如目标值）；
}
value={props.value}
onBlur={（）=>{
道具设置值（tempValue）；
}}
/>
)
}

但由于某些原因，它没有清除值

p、 inputRef、value和setValue是钩子

const [value, setValue] = useState(...);
inputRef = useRef<HTMLInputElement>(null);

const[value，setValue]=useState（…）；
inputRef=useRef（null）；

给定的方法不起作用，因为元素中的变量没有用DOM更新

创建一个临时状态变量

type Props = {
    inputRef: any;
    // value removed because it's not necessary
    // setValue not necessary because value is no longer being changed, the
    // value will be changed in a seperate method that's called in someway
    // on the outer scope
}

const inputField = (props: Props) => {  
    const [value, setValue] = useState(""); // adding the useState hook here gives a inscope temp value
    return(
        <input
            ref= {props.inputRef}
            onChange= {e => 
                setValue(e.target.value);
            }
            value= {value}
        />
    )

类型道具={
输入：任何；
//值已删除，因为它不是必需的
//setValue不是必需的，因为不再更改该值
//值将在以某种方式调用的单独方法中更改
//论外部范围
}
常量输入字段=（props:props）=>{
const[value，setValue]=useState（“”；//在这里添加useState钩子会得到一个inscope临时值
返回(
设定值（即目标值）；
}
value={value}
/>
)

它将设置为调用该方法时初始化的任何值。您可以将动态默认值（

useState（“”）

->

useState（defaultValue）

）设置为超出范围。此解决方案还允许innerscope值不影响输入所需的outerscope值，因此隔离输入字段，并对某些

onSubmit（value:string）

超出范围的方法提供更多控制