前天刚用RN 0.15建立的项目。
项目很简单,就是类似于一个打电话时的拨号键盘。
有一个string变量做为state变量在显示区域显示用户当前已经输入的号码。
显示用的组件就是一个简单的Text组件。
< View style = {styles.numContainer} >
<Text style={styles.numStyle}>
{this.state.inputedNum}
</Text>
< /View>
下面就是15个TouchableOpacity代表15个电话按键。
每按一个键,state变量相应的加一个字符,然后RN动态煊染。
如果是按回退键,我的代码将state变量截掉最后一个字符。然后要求RN煊染。
如果号码长度大于1,RN会煊染得很及时。
但当号码的长度为一时,我再改变state变量,RN经常不煊染,也就是说屏幕上的显示区域还留着那个字符。
但它不是总不煊染,而是不时又显示正确,能在屏幕上的显示区域显示为空。大概十次能正确煊染二、三次。
这个现在是windows 下的RN开发环境,连接Android 5.0系统的真机测试出来的。
刚才在MAC下用iphone真机测了一下,没有这个问题。
看来还是RN的bug啊。
谁能告诉我为什么吗?
下面是部分代码:
getInitialState: function() {
return {
inputedNum: '',
};
},
_onDelPressed:function() {
var intNumLength = this.state.inputedNum.length;
if ( intNumLength <= 1 ) {
this.setState((state) => {
return {
inputedNum: '',
};
});
return;
};
var tempString = this.state.inputedNum.substr( 0, intNumLength - 1 );
this.setState((state) => {
return {
inputedNum: tempString,
};
});
},
onKeyPressed: function( pressedKey ) {
var tempString = this.state.inputedNum.concat( pressedKey );
this.setState((state) => {
return {
inputedNum: tempString,
};
});
},