在 React 中，有哪些方式可以对虚拟 DOM 的 class 属性进行设置或修改？
考察说明
考查 React 中操作虚拟 DOM class 属性的方式，包括静态与动态设置。
回答思路
- 【回答框架 1】React 中操作 class 属性主要有两种方式：使用 className 属性或使用 class 属性。在原生 HTML 中，属性名为 class，但在 React 的 JSX 中，推荐使用 className，因为 class 在 JavaScript 中是保留字，虽然现代 React 也支持 class，但可能会产生警告或兼容性问题。
- 【回答框架 2】如果需要动态控制 class，可以使用模板字符串或条件运算符，也可以使用第三方库 classnames 来简化操作。例如，根据状态添加或移除某个类名，可以在 JSX 中通过表达式计算最终的类名字符串。
- 【回答框架 3】对于更复杂的场景，如根据多个条件组合类名，classnames 库提供了直观的 API，可以接受对象或数组作为参数，自动处理条件逻辑，减少手动拼接字符串的繁琐和出错概率。
- 【关键点 1】React 中推荐使用 className 而非 class 来操作虚拟 DOM 的 class 属性。
- 【关键点 2】动态 class 可通过模板字符串、条件运算符或 classnames 库实现。
- 【关键点 3】classnames 库支持对象和数组语法，便于根据条件组合类名。
- 【易错点 1】在 JSX 中直接使用 class 可能导致控制台警告或与某些工具不兼容。
- 【易错点 2】手动拼接类名字符串时容易产生多余空格或逻辑错误，应优先考虑 classnames 等库。