react-native - TouchableHighlight 和 TouchableOpacity 在 render() 上突出显示

Question

我遇到了这样一种行为:TouchableHighlight 和 TouchableOpacity 在渲染时会产生视觉 react (未调用 onPress)。

有一件事是它看起来有点奇怪，当我进入页面时，我的按钮会稍微“闪烁”。这很奇怪，但可以容忍。更令人沮丧的部分是，如果我更改父组件的状态并因此调用 re-render()，按钮将再次“闪烁”，每当我更改状态时，所有按钮都会闪烁。

按下按钮会改变页面状态，因此按下按钮会使两个按钮都“闪烁”。

我使用 react-redux，但这不应该影响这种行为。

下面的代码只是为了说明。

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

Answer 1

在TouchableOpacity中添加activeOpacity，它会强制不闪烁。

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