从dummy data传递props时，如何同步修改状态容器与文字颜色？

核心思路是给包裹状态文字的容器View添加和文字逻辑一致的条件样式判断，具体操作如下：

• 修改状态容器的样式绑定
  更新PendingReceipt.js里的状态容器代码，给其style数组加入状态判断：

  <View style={[
    GlobalStyle.ReceiptPendingContainer,
    migrateData.status === "Declined" && GlobalStyle.ReceiptDeclinedContainer,
    migrateData.status === "Pending" && GlobalStyle.ReceiptPendingContainer
  ]}>
    <Text style={[
      GlobalStyle.ReceiptAccept, 
      migrateData.status === "Declined" && GlobalStyle.ReceiptDeclined,  
      migrateData.status === "Pending" && GlobalStyle.ReceiptPending
    ]}>{migrateData.status}</Text>
  </View>
  

• 补充容器样式定义（若GlobalStyle中无对应样式）
  在GlobalStyle.js里添加对应状态的容器背景样式，示例：

  export default {
    // 原有样式保留
    ReceiptDeclinedContainer: {
      backgroundColor: '#ffecec', // 与Declined文字颜色匹配的背景色
      borderRadius: 4,
      paddingHorizontal: 8,
      paddingVertical: 2
    },
    ReceiptPendingContainer: {
      backgroundColor: '#fff9e6', // 与Pending文字颜色匹配的背景色
      borderRadius: 4,
      paddingHorizontal: 8,
      paddingVertical: 2
    },
    // 原有样式保留
  };
  

完成后，容器背景色会跟随状态与文字颜色同步变化。

内容的提问来源于stack exchange，提问作者vesh