mirror of
https://github.com/zhigang1992/react-native.git
synced 2026-04-23 20:01:01 +08:00
[RN] Introduce initialValue prop to fix TextInputExamples
Summary: Some of the examples relied on the fact that TextInput wasn't a controlled component before. This introduces a new `initialValue` prop which behaves the way the `value` prop used to - that is, you could type without updating it and it wouldn't get reset, thus acting as just an initial value - and switches the examples to use it where appropriate.
This commit is contained in:
@@ -245,6 +245,12 @@ var TextInput = React.createClass({
|
||||
* unwanted edits without flicker.
|
||||
*/
|
||||
value: PropTypes.string,
|
||||
/**
|
||||
* Provides an initial value that will change when the user starts typing.
|
||||
* Useful for simple use-cases where you don't want to deal with listening
|
||||
* to events and updating the value prop to keep the controlled state in sync.
|
||||
*/
|
||||
defaultValue: PropTypes.string,
|
||||
/**
|
||||
* When the clear button should appear on the right side of the text view
|
||||
*/
|
||||
@@ -348,12 +354,17 @@ var TextInput = React.createClass({
|
||||
}
|
||||
},
|
||||
|
||||
_getText: function(): ?string {
|
||||
return typeof this.props.value === 'string' ?
|
||||
this.props.value :
|
||||
this.props.defaultValue;
|
||||
},
|
||||
|
||||
_renderIOS: function() {
|
||||
var textContainer;
|
||||
|
||||
var props = Object.assign({}, this.props);
|
||||
props.style = [styles.input, this.props.style];
|
||||
|
||||
if (!props.multiline) {
|
||||
for (var propKey in onlyMultiline) {
|
||||
if (props[propKey]) {
|
||||
@@ -370,7 +381,7 @@ var TextInput = React.createClass({
|
||||
onBlur={this._onBlur}
|
||||
onChange={this._onChange}
|
||||
onSelectionChangeShouldSetResponder={() => true}
|
||||
text={this.props.value}
|
||||
text={this._getText()}
|
||||
mostRecentEventCount={this.state.mostRecentEventCount}
|
||||
/>;
|
||||
} else {
|
||||
@@ -407,7 +418,7 @@ var TextInput = React.createClass({
|
||||
onSelectionChange={this._onSelectionChange}
|
||||
onTextInput={this._onTextInput}
|
||||
onSelectionChangeShouldSetResponder={emptyFunction.thatReturnsTrue}
|
||||
text={this.props.value}
|
||||
text={this._getText()}
|
||||
/>;
|
||||
}
|
||||
|
||||
@@ -457,7 +468,7 @@ var TextInput = React.createClass({
|
||||
password={this.props.password || this.props.secureTextEntry}
|
||||
placeholder={this.props.placeholder}
|
||||
placeholderTextColor={this.props.placeholderTextColor}
|
||||
text={this.props.value}
|
||||
text={this._getText()}
|
||||
underlineColorAndroid={this.props.underlineColorAndroid}
|
||||
children={children}
|
||||
/>;
|
||||
|
||||
Reference in New Issue
Block a user