亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

React:在函數組件中使用 refs

React:在函數組件中使用 refs

弒天下 2022-10-27 14:34:13
我是 React 的新手,我正在嘗試弄清楚如何在我的函數組件中使用 Refs 來獲取 div 的寬度。一些顯示我的困惑的代碼如下:import React, { useRef } from "react";import "./styles.css";export default function App() {  const eyes = useRef();  function onMouseMoveFn(e) {    const x = eyes.current.offsetX();    const y = eyes.current.offsetY();    console.log(x, y, eyes);  }  return (    <div onMouseMove={onMouseMoveFn}>      <div class="eyes" ref={eyes}>        <div class="eye" />        <div class="eye" />      </div>    </div>  );}(當您將鼠標懸停在沙盒瀏覽器中的眼睛上時,理想情況下應該會導致控制臺顯示一組眼睛的 x 和 y 坐標,但它會給出錯誤)在 React 的文檔中,它說“但是,只要您引用 DOM 元素或類組件,您就可以在函數組件中使用 ref 屬性”所以我不明白為什么上面的代碼不起作用。
查看完整描述

1 回答

?
慕桂英4014372

TA貢獻1871條經驗 獲得超13個贊

您可以使用當前元素的函數訪問偏移量getBoundingClientRect,請參見以下代碼:

eyes.current.getBoundingClientRect().x


查看完整回答
反對 回復 2022-10-27
  • 1 回答
  • 0 關注
  • 104 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號