为什么 CurrencyFormat 没有呈现在我的页面中？

Question

我使用"npm install react-currency-format——save——force"安装了CurrencyFormat。但CurrencyFormat不是渲染在我的页面。顺便说一下，按钮后CurrencyFormat工作正常。任何人都可以帮助我，为什么CurrencyFormat不是渲染?

import React from "react";
import "./Subtotal.css";
import CurrencyFormat from "react-currency-format";
function Subtotal() {
return (
<div className="subtotal">
<CurrencyFormat
renderText={(value) => {
<>
<p>
Subtotal (0 items): <strong>0</strong>
</p>
<small className="subtotal__gift">
<input type="checkbox" />
This order contains a gift
</small>
</>;
}}
decimalScale={2}
value={0}
displayType={"text"}
thousandSeparator={true}
prefix={"$"}
/>
<button>Go to checkout</button>
</div>
);
}
export default Subtotal;

Answer 1

试试这个codesandbox链接它工作，你必须返回函数。

codesandbox link: https://codesandbox.io/s/funny-lalande-uu0lu6?file=/src/App.js

Answer 2

你犯了一个小错误。添加"return"内部renderText

renderText={(value) => {
return <>
<p>
Subtotal (0 items): <strong>0</strong>
</p>
<small className="subtotal__gift">
<input type="checkbox" />
This order contains a gift
</small>
</>;
}}