Skip to content

Commit c475699

Browse files
zpaozpao
committed
[examples] Use ReactDOM for appropriate APIs
1 parent 715dea0 commit c475699

15 files changed

Lines changed: 25 additions & 14 deletions

File tree

‎examples/basic-click-counter/index.html‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
<meta charset="utf-8">
55
<title>Basic Example with Click Counter</title>
66
<script src="../../build/react.js"></script>
7+
<script src="../../build/react-dom.js"></script>
78
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script>
89
</head>
910
<body>
@@ -23,7 +24,8 @@
2324
return (<h2 onClick={this.handleClick}>Click me! Number of clicks: {this.state.clickCount}</h2>);
2425
}
2526
});
26-
React.render(<Counter />,
27+
ReactDOM.render(
28+
<Counter />,
2729
document.getElementById('message')
2830
);
2931
</script>

‎examples/basic-jsx-external/example.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ var ExampleApplication = React.createClass({
1212
var start = new Date().getTime();
1313

1414
setInterval(function() {
15-
React.render(
15+
ReactDOM.render(
1616
<ExampleApplication elapsed={new Date().getTime() - start} />,
1717
document.getElementById('container')
1818
);

‎examples/basic-jsx-external/index.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ <h4>Example Details</h4>
2525
<a href="https://facebook.github.io/react" target="_blank">facebook.github.io/react</a>.
2626
</p>
2727
<script src="../../build/react.js"></script>
28+
<script src="../../build/react-dom.js"></script>
2829
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script>
2930
<script type="text/babel" src="example.js"></script>
3031
</body>

‎examples/basic-jsx-harmony/index.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ <h4>Example Details</h4>
2424
<a href="https://facebook.github.io/react" target="_blank">facebook.github.io/react</a>.
2525
</p>
2626
<script src="../../build/react.js"></script>
27+
<script src="../../build/react-dom.js"></script>
2728
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script>
2829
<script type="text/babel">
2930
class ExampleApplication extends React.Component {
@@ -38,7 +39,7 @@ <h4>Example Details</h4>
3839
}
3940
var start = new Date().getTime();
4041
setInterval(() => {
41-
React.render(
42+
ReactDOM.render(
4243
<ExampleApplication elapsed={new Date().getTime() - start} />,
4344
document.getElementById('container')
4445
);

‎examples/basic-jsx-precompile/example.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ var ExampleApplication = React.createClass({
1212
var start = new Date().getTime();
1313

1414
setInterval(function() {
15-
React.render(
15+
ReactDOM.render(
1616
<ExampleApplication elapsed={new Date().getTime() - start} />,
1717
document.getElementById('container')
1818
);

‎examples/basic-jsx-precompile/index.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ <h4>Example Details</h4>
2525
<a href="https://facebook.github.io/react" target="_blank">facebook.github.io/react</a>.
2626
</p>
2727
<script src="../../build/react.js"></script>
28+
<script src="../../build/react-dom.js"></script>
2829
<script src="build/example.js"></script>
2930
</body>
3031
</html>

‎examples/basic-jsx/index.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ <h4>Example Details</h4>
2424
<a href="https://facebook.github.io/react" target="_blank">facebook.github.io/react</a>.
2525
</p>
2626
<script src="../../build/react.js"></script>
27+
<script src="../../build/react-dom.js"></script>
2728
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script>
2829
<script type="text/babel">
2930
var ExampleApplication = React.createClass({
@@ -38,7 +39,7 @@ <h4>Example Details</h4>
3839
});
3940
var start = new Date().getTime();
4041
setInterval(function() {
41-
React.render(
42+
ReactDOM.render(
4243
<ExampleApplication elapsed={new Date().getTime() - start} />,
4344
document.getElementById('container')
4445
);

‎examples/basic/index.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ <h4>Example Details</h4>
2424
<a href="https://facebook.github.io/react" target="_blank">facebook.github.io/react</a>.
2525
</p>
2626
<script src="../../build/react.js"></script>
27+
<script src="../../build/react-dom.js"></script>
2728
<script>
2829
var ExampleApplication = React.createClass({
2930
render: function() {
@@ -41,7 +42,7 @@ <h4>Example Details</h4>
4142

4243
var start = new Date().getTime();
4344
setInterval(function() {
44-
React.render(
45+
ReactDOM.render(
4546
ExampleApplicationFactory({elapsed: new Date().getTime() - start}),
4647
document.getElementById('container')
4748
);

‎examples/jquery-bootstrap/index.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
<body>
1111
<div id="jqueryexample"></div>
1212
<script src="../../build/react.js"></script>
13+
<script src="../../build/react-dom.js"></script>
1314
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script>
1415
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js" charset="utf-8"></script>
1516
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.min.js" charset="utf-8"></script>

‎examples/jquery-bootstrap/js/app.js‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -18,17 +18,17 @@ var BootstrapModal = React.createClass({
1818
// integrate Bootstrap or jQuery with the components lifecycle methods.
1919
componentDidMount: function() {
2020
// When the component is added, turn it into a modal
21-
$(React.findDOMNode(this))
21+
$(ReactDOM.findDOMNode(this))
2222
.modal({backdrop: 'static', keyboard: false, show: false});
2323
},
2424
componentWillUnmount: function() {
25-
$(React.findDOMNode(this)).off('hidden', this.handleHidden);
25+
$(ReactDOM.findDOMNode(this)).off('hidden', this.handleHidden);
2626
},
2727
close: function() {
28-
$(React.findDOMNode(this)).modal('hide');
28+
$(ReactDOM.findDOMNode(this)).modal('hide');
2929
},
3030
open: function() {
31-
$(React.findDOMNode(this)).modal('show');
31+
$(ReactDOM.findDOMNode(this)).modal('show');
3232
},
3333
render: function() {
3434
var confirmButton = null;
@@ -124,4 +124,4 @@ var Example = React.createClass({
124124
}
125125
});
126126

127-
React.render(<Example />, document.getElementById('jqueryexample'));
127+
ReactDOM.render(<Example />, document.getElementById('jqueryexample'));

0 commit comments

Comments
 (0)