Question

我有一个反应应用程序和响应式菜单我需要它接受jQuery，以便我可以使用菜单切换菜单。我很反应，当我将简单的jQuery添加到react中时，它会显示错误。

import React from 'react';
import { Link } from 'react-router';

function Menu() {
  return (
  <div className="head row">
    <div className="container">
      <div className="col-md-12">
        <div className="col-sm-12 col-md-6 top-left">
          <Link to ="/"><img className="img-responsive mainlogo"  src={require('./Header-logo.png')} alt="logo"/></Link>
          <Link className="peaks" to="/">SPORT</Link>
          <div className="mobile-menu hidden-md hidden-lg">
            <div className="icon"><Link className="toggle-menu" to="#"><i className="material-icons">menu</i></Link></div>
            <div className="text">MENU</div>
          </div>
        </div>
      </div>
    </div>
  </div>

  (".toggle-menu").click(function(){
  (".menu").toggle();
  });

  );
}

export default Menu;

Answer 1

你使用ES6我可以看到，所以我建议使用类并扩展Component对象。一般来说，当你真的必须在React中使用JQuery时，你可以这样做：

import React, { Component } from 'react';
import { Link } from 'react-router';

class Menu extends Component {
  componentDidMount() {
    //some JQuery code - runs after render function
  }
  render() {
    return <div className="head row">
      <div className="container">
        {/* your HTML that I'm skipping */}
      </div>
    </div>
  }
}

export default Menu;

如何将jQuery合并到react应用程序中？

1 个答案: