为什么`this.refs`在这个简单的例子中返回undefined?

时间:2016-07-21 06:21:56

标签: javascript reactjs

在以下示例中, public static int getRandom() { int random_number=0; Random random = new Random(); random_number= random.nextInt(9999 - 1000) + 1000; return random_number; } } 返回this.refs.foo.clientWidth,我无法弄清楚原因。如何在undefined中获取SomeComp的引用以使用其宽度? (使用React 15.2.1或类似的)

PageComp

JSBIN

3 个答案:

答案 0 :(得分:5)

this.refs.foo返回React Element。 但是如果你想使用DOM元素 - 你需要找到这个节点

React 15.0.1需要此语法ReactDOM.findDOMNode(this.refs.foo)

JSBIN: http://jsbin.com/xabidaquti/1/edit?html,js,console,output

答案 1 :(得分:0)

为了更清晰,如果this.refs.foo.clientWidth设置为refsdiv等html元素,input将有效。由于refs本身将在此类html元素的情况下返回DOM节点。

如果refs设置为某些React组件,那么我们只能使用ReactDom.findDOMNode(this.refs.foo)访问组件的DOM节点,因此我们需要使用{{1}来获取clientWidth }}

Ref

答案 2 :(得分:0)

试试这个ReactDOM.findDOMNode(this.refs["foo"].clientWidth)