未捕獲的類型錯誤：無法讀取未定義的屬性（讀取“參數”）

Question

請告訴我如何解決

product.action.js

import axios from '../helpers/axios';

export const getProductsBySlug = (slug) => {
    
    return async dispatch =>{
        const res = await axios.get(`/products/${slug}`);
        console.log(res);
    }
}

productListPage

[![enter image description here](https://i.stack.imgur.com/cxmbI.png)](https://i.stack.imgur.com/cxmbI.png)

import React, { useEffect } from "react";
import { useDispatch } from "react-redux";
import { getProductsBySlug } from "../../actions";
import Layout from "../../components/Layout";

/**
 * @author
 * @function ProductListPage
 **/

export const ProductListPage = (props) => {
  const dispatch = useDispatch();

  useEffect(() => {
    const { match } = props;
    dispatch(getProductsBySlug(match.params.slug));
  }, []);

  return <Layout>Product List Page</Layout>;
};

我不明白是什么問題所以我收到一條錯誤消息 - 類型錯誤：無法讀取未定義的屬性（讀取“參數”）

Answer 1

嘗試在 slug 可用時進行額外檢查和調度

export const ProductListPage = (props) => {

  const dispatch = useDispatch();

  const { match } = props;

  const slug = match?.params?.slug

  useEffect(() => {

    if (slug) {
      dispatch(getProductsBySlug(slug));
    }   
    
  }, [slug]);

  return <Layout>Product List Page</Layout>;
};

希望能幫助到你