未處理的拒絕（TypeError）：調度不是 function 反應 js

Question

當我嘗試加載我的玩具列表時出現此錯誤：

未處理的拒絕（TypeError）：調度不是 function 反應 js

當我刷新頁面時，它會顯示列表片刻，然后出現錯誤。 我已經在谷歌上搜索了幾個小時，老實說，我不知道我做錯了什么。 我的目標是能夠按下排序按鈕並能夠按字母順序對玩具進行排序，然后再次按下它以顯示未排序的玩具。

如果您有任何建議，請以我的方式發送。 謝謝！

const ToyList = (props) => {
  const [toys, setToys] = useState([]);
  const [sortToys, setSortToys] = useState(false);
  const [startingToys, setStartingToys] = useState([]);

  // On launch we can save the inital order to state
  useEffect(() => {
    // Set the toys
    setToys(fetchToys());
    // Save this ordering
    setStartingToys(toys);
  }, []);


  // Whenever sortToys changes, we can also change toys
  // thus re-rendering the list in the order you want
  useEffect(() => {
    if (sortToys) {
      setToys(toys.sort((a, b) => a.name.localCompare(b.name)));
    } else {
      setToys(startingToys);
    }
  }, [sortToys]);


  // Function to change the sort
  const handleSortChange = () => setSortToys(() => !sortToys);


    return (
       <div>
      <div className="sortDiv">
        <Button className="m-3" value="toy" onClick={handleSortChange}>Toys A-Z</Button>
      </div>
      <div>
      </div>
      {props.toys.map(toy =>
        <Container fluid>
        <Row>
            <Col key={toy.id}>
                <Card style={{ width: '17rem' }} className='text-center'>
              <Link to={`/toys/${toy.id}`}>{toy.name}
              <Card.Img variant='top' src={toy.image_url} alt="toyimage" width="300" height="300" /></Link>
              </Card>
            </Col>
        </Row>
        </Container> ) }   
        </div> 
    )
      }
      export default ToyList

我的 fetchToys 動作：

export function fetchToys() {
    return (dispatch) => {
    fetch('http://localhost:3000/api/v1/toys')
    .then(response => response.json())
    .then(toys=> dispatch({
        type: 'FETCH_TOYS', 
        payload: toys
    }))
    }
}

Answer 1

export function fetchToys()是錯誤的。 試試這個： export function fetchToys(dispatch)