jQuery 没有在 React 组件中执行答案

【问题标题】：jQuery is not executing in React componentjQuery 没有在 React 组件中执行
【发布时间】：2018-02-05 21:19:38
【问题描述】：

我正在尝试使用 jQuery 在我的 React 登录组件中删除和添加一个类。当代码执行时，似乎只是跳过了 jQuery。我没有收到任何错误消息，并且 jQuery 函数没有运行。这是我的 jQuery 在我的 React 组件方法中的样子：

handleLogin(e) {
e.preventDefault();

const email = this.refs.loginEmail.value;
const password = this.refs.loginPassword.value;

auth.signInWithEmailAndPassword(email, password)
  .then(() => {
    Store.dispatch({type: 'LOG_IN', payload: true});
    history.push('/');
  })
  .catch(error => {
    $('.login-box').addClass('error-shake');
    $('.login-box').delay(200).removeClass('error-shake');
    throw new Error(error.code + ': ' + error.message);
  });

}

任何帮助将不胜感激！

【问题讨论】：

标签： javascript jquery reactjs

【解决方案1】：

您正在干扰 React 渲染。 React 保留一个虚拟 DOM，并将这个 VDOM 的差异呈现给文档 DOM。您正在对 React 不知道的 DOM 应用更改，并且一旦重新呈现组件，它将覆盖这些更改。简而言之：除非您知道自己在做什么，否则不要将 jquery 与 React 一起使用。您可以查看这些文档 https://reactjs.org/docs/integrating-with-other-libraries.html 以与外部库集成。

【讨论】：