Javascript 反应本机模式-设置状态是否不够快？

我花了几个小时研究这个错误，我希望另一双眼睛能帮我解决这个问题！谢谢你的帮助

我有一个React原生应用程序，在一个Modal中，我有一个带有单选按钮的选项列表

我想要的是： 当您单击模型列表中的TouchableHighlight项目时，我希望单选按钮移动到用户按下的项目。换句话说，如果我按下我单击的项目的rowId，我想将单选按钮设置为选中

正在发生的事情： 当我关闭模式并重新打开时，我看到单选按钮已移动到正确的选项，但问题是我需要单选按钮在单击时立即移动！因此，我正在设置正确的状态，但组件在重新打开模式之前不会重新渲染

这是我的自定义单选按钮组件：

    export default RadioButton = ({style, selected}) => {
  return (
      <View style={[{
        height: 24,
        width: 24,
        borderRadius: 12,
        borderWidth: 2,
        borderColor: colors.primaryText,
        alignItems: 'center',
        justifyContent: 'center',
      }, style]}>
        {
          selected ?
            <View style={{
              height: 16,
              width: 16,
              borderRadius: 8,
              backgroundColor: colors.primaryText,
            }}/>
            : null
        }
      </View>
  );
}

ShippingMethodOptions是一个围绕ListView的组件，并向下传递适当的道具

const ShippingMethodOptions = ({dataSource, renderRow, renderSeparator, closeModal}) => {
  return(
        <View style={backgroundApp}>
      <NavHeader closeModal={closeModal}/>
      <Text style={[subHeader, textSection]}></Text>
      <View style={hr}></View>

      <ListView 
        dataSource={dataSource}
        renderRow={renderRow}
        renderSeparator={renderSeparator} 
      />
    </View>
    )
}

constshippingmethodoptions=（{dataSource，renderRow，renderSeparator，closeModal}）=>{
返回(
)
}

我注意到，当我升级到React 16 with fiber时，单选按钮按预期工作，因此我想知道一些事情

是不是光纤的速度太快了，我可以写更多的小车代码

当使用更新的React版本时，模态组件中的生命周期方法是否有不同之处

setState是否有一些不同之处，导致更多内容使用光纤重新渲染

更新

---

我已经在控制台上记录了这个过程，我看到在按下某个项目后，不会再次调用ListView上的renderRow，而是调用SelectedShippingMethod，并选择了一个

undefined

。为什么会发生这种情况？我如何才能使其正常工作？

是否正在更新ListView数据源中的数据？请看这里的第二段：@NathanK我没有更新数据，因为数据没有改变，只是单选按钮改变了。。。也许我应该将所选选项添加到数据中，使其发生更改？是否正在更新ListView数据源中的数据？请看这里的第二段：@NathanK我没有更新数据，因为数据没有改变，只是单选按钮改变了。。。也许我应该将所选选项添加到数据中，使其发生更改？

return(
        <TouchableHighlight 
            onPress={onPress}>
            <View style={[rowWrapper, {alignItems: 'center', paddingLeft: 5}]}>
                { !singleRow && <RadioButton selected={selected}/>}
                <View style={styles.methods}>
                    <Text style={descriptionColor}>{description}</Text> 
                    <Text style={subHeader}>{shipDate}</Text>
                </View>
                <Text style={styles.price}>{shipPrice}</Text>
                {/*<Icon name="ios-arrow-forward" size={17} color={colors.iconGrey} style={arrows}/>*/}
            </View>
        </TouchableHighlight>
    )

const ShippingMethodOptions = ({dataSource, renderRow, renderSeparator, closeModal}) => {
  return(
        <View style={backgroundApp}>
      <NavHeader closeModal={closeModal}/>
      <Text style={[subHeader, textSection]}></Text>
      <View style={hr}></View>

      <ListView 
        dataSource={dataSource}
        renderRow={renderRow}
        renderSeparator={renderSeparator} 
      />
    </View>
    )
}