@samitouri / QOS-React-2 / commits / ca66baee83

Docs: renamed input's state to `message`

Readers might feel confused with the actual input's `value` attribute.

Julen Ruiz Aizpuru committed Aug 26, 2014 at 15:28 UTC ca66baee8326dad6dcfa94ea76c1532dc8ec60b3
1 file changed +11 -11
docs/docs/09.2-form-input-binding-sugar.md
+11 -11
@@ -33,14 +33,14 @@ Here's a simple form example without using `ReactLink`:
33
34 var NoLink = React.createClass({
35 getInitialState: function() {
36 - return {value: 'Hello!'};
36 + return {message: 'Hello!'};
37 },
38 handleChange: function(event) {
39 - this.setState({value: event.target.value});
39 + this.setState({message: event.target.value});
40 },
41 render: function() {
42 - var value = this.state.value;
43 - return <input type="text" value={value} onChange={this.handleChange} />;
42 + var message = this.state.message;
43 + return <input type="text" value={message} onChange={this.handleChange} />;
44 }
45 });
46 ```
@@ -53,10 +53,10 @@ This works really well and it's very clear how data is flowing, however with a l
53 var WithLink = React.createClass({
54 mixins: [React.addons.LinkedStateMixin],
55 getInitialState: function() {
56 - return {value: 'Hello!'};
56 + return {message: 'Hello!'};
57 },
58 render: function() {
59 - return <input type="text" valueLink={this.linkState('value')} />;
59 + return <input type="text" valueLink={this.linkState('message')} />;
60 }
61 });
62 ```
@@ -82,14 +82,14 @@ There are two sides to `ReactLink`: the place where you create the `ReactLink` i
82
83 var WithoutMixin = React.createClass({
84 getInitialState: function() {
85 - return {value: 'Hello!'};
85 + return {message: 'Hello!'};
86 },
87 handleChange: function(newValue) {
88 - this.setState({value: newValue});
88 + this.setState({message: newValue});
89 },
90 render: function() {
91 var valueLink = {
92 - value: this.state.value,
92 + value: this.state.message,
93 requestChange: this.handleChange
94 };
95 return <input type="text" valueLink={valueLink} />;
@@ -107,10 +107,10 @@ As you can see, `ReactLink` objects are very simple objects that just have a `va
107 var WithoutLink = React.createClass({
108 mixins: [React.addons.LinkedStateMixin],
109 getInitialState: function() {
110 - return {value: 'Hello!'};
110 + return {message: 'Hello!'};
111 },
112 render: function() {
113 - var valueLink = this.linkState('value');
113 + var valueLink = this.linkState('message');
114 var handleChange = function(e) {
115 valueLink.requestChange(e.target.value);
116 };