Javascript 在React中使用JQuery

我在React函数组件中使用JQuery来选择具有特定标记+类的节点，就像在CSS中一样，但是除了Javascript经典方式之外，我还可以使用React做类似的事情吗？例如，如果我有一个无序列表，其中有一个类为“active”的元素，我可以使用JQuery删除他的类：

  $("ul li.active").removeClass("active");

根据我现在发现的，与React类似的是：

let element = document.getElementByClassName("active")
ReactDOM.findDOMNode(element).classList.remove("active"); 

显然，这两种方法是不等价的，因为在JQuery-one中，我还指定了我希望节点是一个

li

，类

active

，它是

ul

的子节点，所以我可能需要为它再写两行代码来匹配JQuery命令

---

这是一种更短或更好的方法吗？在React中使用JQuery也可以吗？

React不鼓励使用直接DOM操作。它很脆弱，在重新渲染组件时可能会断裂

您应该将所选项目存储在状态中，并基于该状态生成类名

const项=[
{
名称：“一”，
},
{
姓名：“两个”，
},
{
姓名:"三",，
},
];
常量应用=（）=>{
const[selected，updateSelected]=React.useState（[“两个]）；
返回(
{items.map（（item）=>(
{
如果（选中。包括（项目名称））
updateSelected（selected.filter（（name）=>name！==item.name））；
else updateSelected（[…selected，item.name]）；
}}
>
{item.name}
))}
);
};
render（，document.body）
。所选{背景：蓝色；}
React不鼓励使用直接DOM操作。它很脆弱，在重新渲染组件时可能会断裂

您应该将所选项目存储在状态中，并基于该状态生成类名


const项=[
{
名称：“一”，
},
{
姓名：“两个”，
},
{
姓名:"三",，
},
];
常量应用=（）=>{
const[selected，updateSelected]=React.useState（[“两个]）；
返回(
{items.map（（item）=>(
{
如果（选中。包括（项目名称））
updateSelected（selected.filter（（name）=>name！==item.name））；
else updateSelected（[…selected，item.name]）；
}}
>
{item.name}
))}
);
};
render（，document.body）
。所选{背景：蓝色；}

Ref:“使用JQuery Inner React可以吗”不是最佳实践，但不会破坏您的设计。@Yoshi您说得对，谢谢。Ref:“使用JQuery Inner React可以吗”不是最佳实践，但不会破坏您的设计。@Yoshi您说得对，谢谢。