如何在下一個js中將img src作為參數傳遞給無狀態function？

Question

我想在下一個 js 中將 img src 作為參數傳遞給無狀態的 function。 這是我的組件文件：

  import styles from "../../styles/modules/Card.module.css"
  import Image from "next/image"
    
    const Activity = (img) => {
     
      return ( <>
          <div className={styles.card} id="blue">
           <Image className={styles.card_img} src={img} width={160} height={360} />
          </div>
    
      </> );
    }
     
    export default Activity;

還有被調用的文件：

import Activity from "../../components/Lists/Activity"
  
const About = () => {
  return ( <>    
    <Activity img="https://placekitten.com/289/220"/>
    </>);
}
 
export default About;

這是我在運行時遇到的錯誤：

服務器錯誤類型錯誤：src.startsWith 不是 function

請幫忙

Answer 1

在您的情況下， img不是字符串。 它是一個帶有img屬性的object 。 所以它看起來像這樣： img.img 。 你可以像這樣傳遞它：

<Image className={styles.card_img} src={img.img} width={160} height={360} />