呈触摸光和触摸式的渲染()都会突出显示

Question

我经历了一种行为，在渲染时可触摸光明和触摸可触摸可视（未调用onpress）。

一件事是，当我输入页面并且按钮会产生一个小的"眨眼"时，它看起来有些奇怪。这是奇怪但可以忍受的。更令人沮丧的部分是，如果我更改父组件的状态并因此调用重新渲染（），则按钮将再次"闪烁"，每当我更改状态时，所有按钮都会闪烁。

按下按钮会改变页面状态，因此按下按钮使两个按钮都"眨眼"。

我使用React-Redux，但这不应影响此行为。

下面的代码仅用于插图。

render()
{
    return(
        <View>
            <ToucableHightlight> //Click here changes state
                <Content/>
            </ToucableHightlight>
            <ToucableHightlight>  //Click here changes state
                <Content/>
            </ToucableHightlight>
        <View>
    );
}

Answer 1

在触摸可触摸中添加ActiveOpation，它将强迫不眨眼。

<TouchableOpacity style={styles.opecity} activeOpacity={1}>

Answer 2

我解决了问题。在渲染函数的早期，我定义了"内容"组件，从而在每个更新期间定义了新的（但都一样）组件。将"内容"的定义放在渲染函数之外修复它，以便在重新渲染页面时不再闪烁组件。

这解释了为什么我的组件在父组件中的每个渲染上都呈现为新组件，但是它不能解释为什么touchableHighlight在其初始渲染过程中会闪烁。

在初始渲染期间闪烁的按钮是我可以接受的 - 任何状态变化的按钮都不是。

所以我现在很开心。

Answer 3

不确定是否是因为我正在运行以后的版本，但是我发现这种闪烁的行为仅在第一次单击时发生。

我的解决方案是将触发重新启动的代码放在settimeout

中

         <TouchableOpacity
            onPress={function() {
              setTimeout(function() {
                _this.setState({myState: 'someValue'})
              });
            }}
          >