在React中使用Material UI卡传递属性

Question

我正在使用React开发一个应用程序。在我的组件之一中，我正在使用Material UI卡来映射和显示以下项目：

  const articleData = [
  {
    title: 'title1',
    author: 'author1',
    date: 'date1',
  },
  {
    title: 'title2',
    author: 'author1',
    date: 'date1',
  },
];

function ArticleList() {
 return (
   <div className="root" title={articleData[1].title}>
     <div className="child">
       {articleData.map(article => (
         <Card onPress={() => handleCardActionClick()} key= 
           {article.title} className="article">
             <CardActionArea href="/article">
               <CardContent className="article-content" title=
                 {article.title}>
                   {article.title}
               </CardContent>
             </CardActionArea>
          </Card>
        ))}
     </div>
  </div>
 );
}

我正在使用CardActionArea使Card可点击。单击卡片后，用户将被重定向到呈现“文章”组件的页面。我的问题是：如何使用Card或CardActionArea将属性（如文章标题，作者，出版日期）传递给Article组件？我尝试了title =“ something”，name =“ something”等，但没有任何效果。

先谢谢您！