我们如何在渲染时向“ReactMarkdown”添加多个类

我的反应应用程序,我正在使用 react markdown 用于呈现博客内容。我们如何将多个类添加到 ReactMarkdown 目前,我已经使用 dataArea 仅使用类,但我需要使用以下类进行样式设计。有人能建议一下吗?

.blogImageSection
.dataArea 
.dataDate 
.tags 
.readmoreLink 
.dataArea p 
. views

csb链接供参考: https://codesandbox.io/s/great-bardeen-9lsog5?file=/src/App.js

//反应降价用法:

 { popularResults.map (({id, blogdetails, tags, createdAt }) => (

        <ReactMarkdown className='dataArea' remarkPlugins={[remarkGfm]}>{blogdetails} 
        </ReactMarkdown>
          
        ))} 

这是我在没有使用reactmarkdown的情况下使用上述类的正常博客

<a key={id} href="my url">
          <div key={id} className='blogImageSection'>
            <img alt="id" src={photo} />
            <div key={id} className='dataArea'>
              <span key={id} className='dataDate'>{date}</span>
              <span className='tags'>cypress</span>
              <h3>{heading}</h3>
              <p>
                Best heading added here.
                The most relevant data added here.
                Greatest of all time. Print the whole text here.
                Ideas are always usefull....
              </p>
              <a href="_blank" className="readmoreLink">
                Read more →
              </a>
              <span className='views'>
                {topViews > 999 ? (topViews / 1000).toFixed(2) + "K" : topViews}
              </span>
            </div>
          </div>
        </a>