React js sidenav中的jQuery无法正常工作

Question

试图在React的我的一个子组件signedOutLinks中使用jQuery，但不知道它是如何工作的。...

import $ from 'jquery'
$(document).ready(function(){$('.sidenav').(sidenav();})

import React from 'react';
import { NavLink } from 'react-router-dom';
import $ from 'jquery';

$(document).ready(function() {
    $('.sidenav').sidenav();
});

const SignedOutLinks = () => {
    return (
        <div>
            <NavLink to="#" className="sidenav-trigger nav-wrapper" data-target="mobile-links">
                <i className="material-icons">menu</i>
            </NavLink>
            <ul className="right hide-on-med-and-down">
                <li className="waves-effect waves-light">
                    <NavLink to="/signup">Signup</NavLink>
                </li>
                <li className="waves-effect waves-light">
                    <NavLink to="/signin">Login</NavLink>
                </li>
            </ul>
            <ul className="sidenav" id="mobile-links">
                <li className="waves-effect waves-light">
                    <NavLink to="/signup">Signup</NavLink>
                </li>
                <li className="waves-effect waves-light">
                    <NavLink to="/signin">Login</NavLink>
                </li>
            </ul>
        </div>
    );
};

export default SignedOutLinks;

  

未捕获的TypeError：jquery__WEBPACK_IMPORTED_MODULE_2 ___ default（...）（...）。sidenav不是函数