🦉 引用（References）🦉

useRef 钩子在我们需要与组件内部的某些部分进行交互时非常有用，这些部分是由 Owl 渲染出来的。它可以作用于 DOM 节点或组件，并通过 t-ref 指令进行定位。详情可参阅 hooks 章节。

下面是一个简短示例，展示了如何让某个输入框获得焦点：

xml

<div>
    <input t-ref="input"/>
    <button t-on-click="focusInput">Click</button>
</div>

import { useRef } from "owl/hooks";

class SomeComponent extends Component {
  inputRef = useRef("input");

  focusInput() {
    this.inputRef.el.focus();
  }
}

请注意，只有当 t-ref 指令所作用的目标已经挂载到 DOM 中时，el 属性才会被设置。否则，它将为 null。

useRef 钩子不能用于获取子组件的实例引用。

注意，这个示例中使用了 ref 作为引用的后缀。这并不是强制要求，但作为一种有用的命名习惯，有助于我们记住这是一个引用对象。

🦉 引用（References）🦉 ​

🦉 引用（References）🦉