我有个小问题。 我的想法是在两个不同的。css类中有一个选项来改变值
<select>
<option value="one">Orange/Blue<option>
<option value="two">example1/example1<option>
<option value="three">example2/example2<option>
<select>
我该如何处理那种情况呢？ 我会在下面添加一些图片，这样你就能更多地理解我了。
现状
所以，如果我选择第二个选项，我会得到不同的颜色选项。 我还有.css类和一些随机文本&； 另一个.css类上的Blue examples。 我希望你们都明白我的意思！
提前谢谢你！
这是app.js文件
import React, { useState } from "react";
import "./styles.css";
export default function App() {
const [select, setSelect] = useState("blue");
return (
<div className="App">
<h1>Welcome</h1>
<hr />
<h2 className={select === "blue" ? "blue" : "orange"}>
Some random text!
</h2>
<select defaultValue={"blue"} onChange={e => setSelect(e.target.value)}>
<option value="orange">Orange</option>
<option value="blue">Blue</option>
</select>
</div>
);
}
这是style.css。
.blue {
color: blue;
}
.orange {
color: orange;
}
这是链接https://codesandbox.io/s/infallible-thunder-zwrc8
