T | null overload for useRef in React

huangapple go评论64阅读模式
英文:

T | null overload for useRef in React

问题

React类型定义中,useRef对于T|nullT有函数重载:

function useRef<T>(initialValue: T): MutableRefObject<T>;
// 用于以ref属性形式传递的便捷重载,因为它们通常以null值开始
/**
 * ...
 *
 * 用法说明:如果需要使useRef的结果直接可变,请在泛型参数的类型中包括`| null`。
 *
 * ...
 */
function useRef<T>(initialValue: T|null): RefObject<T>;

如果我使用&lt;T|null&gt;声明useRef,它会使用第一个返回MutableRefObject&lt;T&gt;useRef,而使用&lt;T&gt;声明时,它会使用第二个。

为什么函数重载会这样工作?

当使用T|null声明时,它使用<T>函数,而在使用T声明时,它使用&lt;T|null&gt;函数。

英文:

In React type definition, useRef has function overloading for T|null and T:

    function useRef&lt;T&gt;(initialValue: T): MutableRefObject&lt;T&gt;;
    // convenience overload for refs given as a ref prop as they typically start with a null value
    /**
     * ...
     *
     * Usage note: if you need the result of useRef to be directly mutable, include `| null` in the type
     * of the generic argument.
     *
     * ...
     */
    function useRef&lt;T&gt;(initialValue: T|null): RefObject&lt;T&gt;;

If I declare useRef with &lt;T|null&gt;, it uses first useRef that returns MutableRefObject&lt;T&gt; and when declare with &lt;T&gt;, it uses second one.

Why does this function overloading work like this?

When declaring with T|null, it use <T> function, and on declaring with T, it uses &lt;T|null&gt; function.

答案1

得分: 1

你可以查看 Typing React UseRef Hook 以获取更多详细信息。

英文:

You can check out Typing React UseRef Hook for more details.

huangapple
  • 本文由 发表于 2023年7月24日 19:16:07
  • 转载请务必保留本文链接:https://go.coder-hub.com/76753919.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定