与 Focus style for TextInput in react-native类似,我正在尝试为textInput更改属性underlineColorAndroid. 我使用的是React-Native 0.28.0 OnFocus,属性不会更改.如何在焦点上将下划线更改为其他颜色? 我的示例
我使用的是React-Native 0.28.0
OnFocus,属性不会更改.如何在焦点上将下划线更改为其他颜色?
我的示例代码如下:
'use strict'; import React, { Component } from 'react'; import { AppRegistry, StyleSheet, Text, View, TextInput, ScrollView } from 'react-native'; class RNPlayground extends Component { constructor(props) { super(props); this.state = { hasFocus: false } } _onBlur() { this.setState({hasFocus: false}); } _onFocus() { this.setState({hasFocus: true}); } _getULColor(hasFocus) { console.error(hasFocus); return (hasFocus === true) ? 'pink' : 'violet'; } render() { console.error("this.state="); console.error(this.state); console.error("this.state.hasFocus="); console.error(this.state.hasFocus); return ( <View style={styles.container}> <ScrollView> <TextInput placeholder="textInput" onBlur={ () => this._onBlur() } onFocus={ () => this._onFocus() } style={styles.instructions} underlineColorAndroid={this._getULColor(this.state.hasFocus)}/> </ScrollView> <TextInput>Some sample text</TextInput> </View> ); } }; const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#F5FCFF', }, welcome: { fontSize: 28, textAlign: 'center', margin: 10, }, instructions: { textAlign: 'center', color: '#333333', fontSize: 19, marginBottom: 5, } }); AppRegistry.registerComponent('RNPlayground', () => RNPlayground);那么,你的代码是正确的,它应该正常工作.
Here is working example
请停止投票给这个答案.不幸的是,rnplay服务不再可用,就像这个例子一样.或者downvote但是解释你的观点.