的TextInput在反应机iOS

我有一个TextInput组件中反应本土的TextInput在反应机iOS

<TextInput 
      style={styles.searchBar} 
      value={this.state.searchText} 
      onChange={this.setSearchText.bind(this)} 
      placeholder='Search State' 
     />

这是工作在android系统完全正常，但文本框不会在iOS应用中展示。而且，没有什么可以找到问题所在。

任何人都可以帮助解决这个问题吗？

来源

2016-06-22 Jatin Kinra

你应该给了TextInput高度和宽度，以显示的TextInput为：

<Textinput style={{height:200, width:300}}/>

来源

2016-06-22 11:01:26

它还没有出现。并且，它在android bdw中工作。对iOS来说它有什么不同？ –

下面是一个说明需要提供用于在iOS的TextInput部件的高度的代码示例。在docs中没有明确说明，但仔细查看它会发现代码示例的iOS部分提供了高度，而android样本不提供高度。这里是显示在视图的中心TextInput一个完整的代码示例：

import React, { Component } from 'react'; 
import { 
    AppRegistry, 
    StyleSheet, 
    TextInput, 
    View 
} from 'react-native'; 

class MyApp extends Component { 
    constructor (props) { 
    super(props); 
    this.state = { 
     searchText: '' 
    }; 
    } 

    setSearchText (e) { 
    this.setState({ 
     searchText: e.target.value 
    }); 
    } 

    render() { 
    return (
     <View style={styles.container}> 
     <TextInput 
       style={styles.searchBar} 
       value={this.state.searchText} 
       onChange={this.setSearchText.bind(this)} 
       placeholder='Search State' 
      /> 
     </View> 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    justifyContent: 'center', 
    alignItems: 'center' 
    }, 

    searchBar: { 
    borderWidth: 1, 
    height: 40 
    } 
}); 

AppRegistry.registerComponent('MyApp',() => MyApp);

如果不能在调试代码的完整性检查帮助，请张贴样式定义（styles.searchBar）已配置对于你的TextInput，所以我们可以给出一个更好的测试。

来源

2016-06-22 13:39:56

谢谢。有效。我错过了styles属性 –

的TextInput在反应机iOS

回答

相关问题