diff --git a/spec/dummy/client/app/components/HelloWorld.jsx b/spec/dummy/client/app/components/HelloWorld.jsx index 1f3503caaa..55b302fed3 100644 --- a/spec/dummy/client/app/components/HelloWorld.jsx +++ b/spec/dummy/client/app/components/HelloWorld.jsx @@ -1,5 +1,4 @@ import React, { PropTypes } from 'react'; -import ReactDOM from 'react-dom'; // Super simple example of the simplest possible React component class HelloWorld extends React.Component { @@ -18,11 +17,15 @@ class HelloWorld extends React.Component { this.state = props.helloWorldData; } - _handleChange() { - const name = ReactDOM.findDOMNode(this.refs.name).value; + handleChange() { + const name = this.nameDomRef.name; this.setState({ name }); } + setNameDomRef(nameDomNode) { + this.nameDomRef = nameDomNode; + } + render() { console.log('HelloWorld demonstrating a call to console.log in ' + 'spec/dummy/client/app/components/HelloWorld.jsx:18'); @@ -36,7 +39,7 @@ class HelloWorld extends React.Component {

Say hello to: - +

); diff --git a/spec/dummy/client/app/components/HelloWorldES5.jsx b/spec/dummy/client/app/components/HelloWorldES5.jsx index c00e7419c6..9d24668466 100644 --- a/spec/dummy/client/app/components/HelloWorldES5.jsx +++ b/spec/dummy/client/app/components/HelloWorldES5.jsx @@ -13,11 +13,15 @@ const HelloWorldES5 = React.createClass({ return this.props.helloWorldData; }, - _handleChange() { - const name = ReactDOM.findDOMNode(this.refs.name).value; + handleChange() { + const name = this.nameDomRef.name; this.setState({ name }); }, + setNameDomRef(nameDomNode) { + this.nameDomRef = nameDomNode; + }, + render() { const { name } = this.state; @@ -28,7 +32,7 @@ const HelloWorldES5 = React.createClass({

Say hello to: - +

); diff --git a/spec/dummy/client/app/components/HelloWorldRedux.jsx b/spec/dummy/client/app/components/HelloWorldRedux.jsx index 1a5c2255c8..53c241a85e 100644 --- a/spec/dummy/client/app/components/HelloWorldRedux.jsx +++ b/spec/dummy/client/app/components/HelloWorldRedux.jsx @@ -14,9 +14,13 @@ export default class HelloWorldRedux extends React.Component { super(props, context); } - _handleChange() { - const name = ReactDOM.findDOMNode(this.refs.name).value; - this.props.actions.updateName(name); + handleChange() { + const name = this.nameDomRef.name; + this.setState({ name }); + } + + setNameDomRef(nameDomNode) { + this.nameDomRef = nameDomNode; } render() { @@ -30,7 +34,7 @@ export default class HelloWorldRedux extends React.Component {

With Redux, say hello to: - +

);