小编csj*_*es1的帖子

希望这里有人能帮我解决这个问题。

我正在尝试通过 NextJs 建立一个网站。我的其中一个页面有一些段落和按钮，它们的样式根据状态和事件而有所不同。在使用纯 React 时以及在 NextJs 中使用全局样式表时，我都可以使样式按预期工作；但是当我使用 CSS 模块时，我无法让它按预期运行。

（注意：我还可以通过使用简单的三元来使其工作，例如 <h1 className={submitted ? styles.showresult : styles.hideresult}>Correct? {correct}</h1>；但我还有一些其他场景，我需要依赖多个 if 并创建多个类，每个类都有自己的样式，所以我无法制作一个简单的三元我的最终解决方案。

例如，这是文件 pagex.js

import React from 'react';
import ReactDOM from 'react-dom';

const Pagex = () => {

const [submitted, setSubmitted] = React.useState(false); // whether the submit button was pressed

function calculateScore() {
  let correct = 0
  let incorrect = 0
    //......some scoring logic.....    
  setSubmitted(true)
  }

  // function to create a display class based on whether the submit button has been …