Reactjs：我可以在无状态组件的事件处理程序中访问 ref 吗？

Question

有人知道是否可以从无状态组件onClick处理程序访问ref吗？

例如：

function MyComponent ({myProp}) {
  var userFeedbackNode
  return <div>
    <textarea ref={(c) => userFeedbackNode = c}/>
    <button onClick={()=> {
       //do something with the userFeedbackNode here.
    }}>Send</button>
  </div>
}

我相信这种方法确实有效，但以这种方式分配和访问引用有什么问题吗？

谢谢！

Answer 1

是。不能将ref附加到函数组件本身，但可以获取内部组件的ref(如果它们本身不是函数组件(。您需要将变量引用保持在函数组件本身的范围之外，类似于以下内容：

let _inputRef
const MyComponent = (props) =>
    <input type=text  ref={ref  => typeof _inputRef == 'undefined' ? ref : _inputRef} />

因此，是的，这是可行的，但非常无用，因为功能组件没有生命周期方法，您可能需要使用该方法。