Javascript 如何从react中的功能组件访问外部功能中的ref.current？

这是我的沙箱：

我的控制台返回给我

ref.current为空

但是我无法理解，因为我在函数参数中传递了ref。我已经读到我不能从render函数访问ref，也许通过类比，它对于returns函数是相同的-在函数组件中？但如果是这种情况，我如何从功能组件访问ref

这里是我的片段：

import React from "react"
import ReactDOM from "react-dom"

const accessRef=(elementRef)=>{
  if(elementRef && !elementRef.current) console.log("elementRef.current is null")

}

function App() {

  let child1=React.createRef(); 

  return(
        <div 
          ref={child1}
          name="child1"
          className="circle_container pic2" 
          style={accessRef(child1)}
        >  hello world
        </div> 
  )
}

ReactDOM.render(<App/>, document.getElementById("root"))

从“React”导入React
从“react dom”导入react dom
常量accessRef=（elementRef）=>{
if（elementRef&&！elementRef.current）console.log（“elementRef.current为null”）
}
函数App（）{
让child1=React.createRef（）；
返回(
你好，世界
)
}
ReactDOM.render（，document.getElementById（“根”））

任何暗示都很好，

---

感谢

很可能是感谢的副本，您是否也会收到以下错误消息：未处理的承诺拒绝类型错误：“\u d”是只读的”？不客气，不，我没有收到该错误，您想做什么@WebwomanI已经在stackblitz上运行了它，并且得到了这个错误，但是本地是好的，我只想使用我的react状态进行一些样式设置element@Webwoman为什么要按参照设置图元的样式，可以从access Ref函数返回新样式！但是，如果一切正常，那就好了

const accessRef = async elementRef => {
  if (elementRef && !elementRef.current) {
    const foo = await elementRef;
    console.log(foo.current);
  }
};