Nhập Tiến bộ
Progressive Input được sử dụng như một phần của giải pháp tự động hoàn chỉnh. Bộ điều khiển này có nút xóa để xóa văn bản và chỉ báo hoạt động để hiển thị rằng công việc nền đang được thực hiện.
Bắt đầu
$ npm install react-native-progressive-input --save
Nếu bạn không sở hữu phụ thuộc react-native-vector-icons, hãy đảm bảo bạn cũng chạy:
npm install react-native-vector-icons --save
react-native link
trên cửa sổ terminal. Điều này sẽ thêm một số phông chữ cần thiết và cập nhật Info.plist trên dự án xcode của bạn.
Sử dụng
import ProgressiveInput from 'react-native-progressive-input';
class Screen extends Component {
constructor(props) {
super(props);
this.state = {
value: '',
isLoading: false
};
}
_onChangeText(text) {
this.setState({isLoading: true, value: text});
fetch("YOUR_URL_FOR_GETTING_SUGGESTION")
.then((result) => {
// Process list of suggestions
this.setState({isLoading: false});
});
}
render() {
<ProgressiveInput
value={this.state.value}
isLoading={this.state.isLoading}
onChangeText={this._onChangeText.bind(this)}
/>
}
}
export default Screen;
Thuộc tính
| Tên | Loại |
|---|---|
| autoCorrect | PropTypes.bool |
| keyboardType | TextInput.propTypes.keyboardType |
| multiline | PropTypes.bool |
| placeholderTextColor | PropTypes.string |
| returnKeyType | TextInput.propTypes.returnKeyType |
| selectTextOnFocus | PropTypes.bool |
| placeholder | PropTypes.string |
| editable | PropTypes.bool |
| autoCapitalize | PropTypes.bool |
| maxLength | PropTypes.number |
| multiline | PropTypes.bool |
| onEndEditing | PropTypes.func |
| onChange | PropTypes.func |
| value | PropTypes.string |
| isLoading | PropTypes.bool |
| textInputStyle | TextInput.propTypes.style |
| clearButtonIcon | PropTypes.string |
| clearButtonColor | PropTypes.string |
| clearButtonSize | PropTypes.number |
| clearButtonStyle | PropTypes.object |
| activityIndicatorStyle | ActivityIndicator.propTypes.style |
| onBlur | PropTypes.func |
| onChangeText | PropTypes.func |
| onFocus | PropTypes.func |
| onInputCleared | PropTypes.func |
Tác giả
- Khai Le (Scott)
- Blog: lequangkhai.wordpress.com
Thông tin tải về:
Tác giả: khaiql
Nguồn: https://github.com/khaiql/react-native-progressive-input
Giấy phép: MIT license
