React Native中的TextInput (補充)

React Native中的TextInput (補充)react

TextInput 的屬性：web

import React, { Component } from 'react';
import { AppRegistry, StyleSheet, Image, View,KeyboardAvoidingView, Text, TextInput ,Dimensions,StatusBar, TouchableHighlight, TouchableWithoutFeedback,Alert, ListView, TouchableOpacity, PixelRatio, Platform, RefreshControl, ActivityIndicator, AsyncStorage, ScrollView } from 'react-native';
export default class SearchLessons extends Component{ 
 
   
    constructor(props) {
        super(props);
        var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2}); this.state = { query: '', }; } fetchData() { const REQUEST = `http://api.douban.com/v2/movie/search?q=$(this.state.query)`; fetch(REQUEST) .then(response=>response.json()) .then(responseData=>{ console.log(responseData) }).done(); } render() { return ( <View style={styles.container}> <TextInput style={ 
    {height:30,}} placeholder='默認的內容' clearButtonMode='always' //never 永遠不顯示刪除 always 一直顯示 while--editing 編輯的時候顯示 unless-editing 按完回車纔出現刪除鈕 clearTextOnFocus={ 
    true} //獲取焦點時是否清空文字 、 enablesReturnKeyAutomatically={ 
    false} //是否自動啓用回車鍵，有內容就顯示，沒有就不啓用 returnKeyType = 'go' //回車鍵上的文字: go前往 join加入 next 下一項 route路線 send 發送 search 搜索 onChangeText={(query)=>{ 
    this.setState(query)}} //文字修改完從新給state的query賦值 onSubmitEditing={ 
    this.fetchData.bind(this)} //調用方法 /> </View> ); } }

本文同步分享在博客「zoepriselife316」（CSDN）。
若有侵權，請聯繫 support@oschina.cn 刪除。
本文參與「OSC源創計劃」，歡迎正在閱讀的你也加入，一塊兒分享。json