reactjs RevenueCat显示价格

des4xlb0  于 2023-03-29  发布在  React
关注(0)|答案(2)|浏览(146)

下面的代码:

function Paywall({ onPress }) {

const getPrice = async () => {
    try {
        const offerings = await Purchases.getOfferings();
        if (offerings.current !== null && offerings.current.availablePackages.length !== 0) {
            console.log("OFFERING");
            console.log(offerings.current.monthly);
        }
    } catch (e) {
        console.log(e);
    }

    return offerings
}

useEffect(() => {
    getPrice()
})

return (
    <View style={styles.container}>
        <View style={styles.priceContainer}>
            <Text style={styles.headerText}>£9.99</Text>
            <Text style={styles.perMonthText}>per month</Text>
        </View>
        <View style={styles.buttonContainer}>
            <TouchableOpacity style={styles.button} onPress={onPress}>
                <Text style={styles.buttonText}>Subscribe for £9.99 / month</Text>
            </TouchableOpacity>
        </View>
    </View>
  );
}

我的日志带回来了:

{"identifier": "$rc_monthly", "offeringIdentifier": "sale", "packageType": "MONTHLY", "product": {"currency_code": "GBP", "description": "All Access", "discounts": null, "identifier": "app_499_1m", "introPrice": {"cycles": null, "period": null, "periodNumberOfUnits": null, "periodUnit": null, "price": null, "priceString": null}, "intro_price": null, "intro_price_cycles": null, "intro_price_period": null, "intro_price_period_number_of_units": null, "intro_price_period_unit": null, "intro_price_string": null, "price": 11.99, "price_string": "£11.99", "title": "All Access (App NAME)"}}

如何在<Text>中显示price_string

<Text style={styles.headerText}>£9.99</Text>
rhfm7lfc

rhfm7lfc1#

您必须确保它已定义,然后访问键:

<Text style={styles.headerText}>{offerings?.current?.monthly?.product?.price_string}</Text>
yqhsw0fo

yqhsw0fo2#

这样做

const getPrice = async () => {
  try {
    const offerings = await Purchases.getOfferings();
    if (offerings.current !== null && offerings.current.availablePackages.length !== 0) {
      console.log("OFFERING");
      console.log(offerings.current.monthly);
      setPriceTitle(offerings.current.monthly.product.priceString)
    }
  } catch (e) {
    console.log(e);
  }
}

useEffect(() => {
  getPrice()
}, [priceTitle])

return (
  <View style={styles.container}>
    <View style={styles.priceContainer}>
      <Text style={styles.headerText}>{priceTitle}</Text>
      <Text style={styles.perMonthText}>per month</Text>
    </View>
    <View style={styles.buttonContainer}>
      <TouchableOpacity style={styles.button} onPress={onPress}>
        <Text style={styles.buttonText}>Subscribe for {priceTitle} / month</Text>
      </TouchableOpacity>
    </View>
  </View>
);

}

相关问题