React Native 文本輸入

標籤：onsubmit   import   ted   reg   split   html   gis   文本   port   

TextInput是一個允許使用者輸入文本的基礎組件。它有一個名為onChangeText的屬性，此屬性接受一個函數，而此函數會在文本變化時被調用。另外還有一個名為onSubmitEditing的屬性，會在文本被提交後（使用者按下軟鍵盤上的提交鍵）調用。

import React, { Component } from ‘react‘;import { AppRegistry, Text, TextInput, View } from ‘react-native‘;class PizzaTranslator extends Component {  constructor(props) {    super(props);    this.state = {text: ‘‘};  }  render() {    return (      <View style={{padding: 10}}>        <TextInput          style={{height: 40}}          placeholder="Type here to translate!"          onChangeText={(text) => this.setState({text})}        />        <Text style={{padding: 10, fontSize: 42}}>          {this.state.text.split(‘ ‘).map((word) => word && ‘??‘).join(‘ ‘)}        </Text>      </View>    );  }}// 註冊應用(registerComponent)後才能正確渲染// 注意：只把應用作為一個整體註冊一次，而不是每個組件/模組都註冊AppRegistry.registerComponent(‘PizzaTranslator‘, () => PizzaTranslator);

React Native 文本輸入