在 React 中使用按钮过滤数据

Question

我正在尝试使用按钮来过滤 JSON 中的数据。每当单击按钮时，它将使用过滤后的 JSON 数据更新状态。然后它将返回包含更新数据的列表。现在我有四个按钮来过滤四种不同的“类型”，但代码根本不起作用。import React, { useState, useEffect } from 'react';import * as moment from 'moment';import PollCard from './PollCard'function PollList() {    const [polls, setPolls] = useState(null);    const [loading, setLoading] = useState(false);    const range = 30    var dateRange = moment().subtract(range, 'days').calendar();    async function fetchMyAPI() {        let response = await fetch(url)        const json = await response.json()        var data = json.filter(e => Date.parse(e.endDate) >= Date.parse(dateRange))        setPolls(data.reverse())        setLoading(true);    }    useEffect(() => {        fetchMyAPI();    }, [])    if (!loading) {        return ("Loading...")    }    var A = polls.filter(e => e.type === "A")    var B = polls.filter(e => e.type === "B")    var C = polls.filter(e => e.type === "C")        function showA() {        setPolls(A)    }    function showB() {        setPolls(B)    }    function showC() {        setPolls(C)    }    return (        <div className="polls">            <button onClick={showA()}>A</button>            <button onClick={showB()}>B</button>            <button onClick={showC()}>C</button>            {                polls && polls.map((poll) => (                    <div key={poll.id}>                        <PollCard poll={poll} />                        <hr style={{ opacity: '.1' }} />                    </div>                ))            }        </div>    );}export default PollList;