React.js:使用React.js的jQuery自定义内容滚动条 [英] Reactjs: jQuery custom content scroller with reactjs

问题描述

im tryin在响应中集成Jquery自定义滚动条插件此处.这是我的代码

im tryin to integrate Jquery custom scrollbar plugin here in react. here is my code

import $ from "jquery";
import mCustomScrollbar from 'malihu-custom-scrollbar-plugin';
.....
 componentDidMount: function() {
     // fixed sidebar
        var self = this;
        mCustomScrollbar($);
        $(ReactDom.findDOMNode(this.refs.menu_fixed)).mCustomScrollbar({
            autoHideScrollbar: true,
            theme: 'minimal',
            mouseWheel:{ preventDefault: true }
        });
        self.forceUpdate();
  },

我收到此错误 index.jsx:51 Uncaught TypeError:(0，_malihuCustomScrollbarPlugin2.default)不是一个函数

有人可以帮助使它工作吗

did somebody can help to make it work thanks

推荐答案

这不是React错误.这是基于您的模块加载器(我猜是webpack?)，将jQuery插件视为ES2015模块.尝试以CommonJS样式导入您的插件.换句话说，替换为:

That’s not a React error. That’s based on your module loader (webpack, I’m guessing?) treating the jQuery plugin as if it were an ES2015 module. Try importing your plugin in the CommonJS style. In other words, replace:

import mCustomScrollbar from 'malihu-custom-scrollbar-plugin';

具有:

var mCustomScrollbar = require('malihu-custom-scrollbar-plugin');

如果这不起作用，则需要共享有关模块加载器及其配置的更多信息.

If that doesn’t work, you will need to share more info about your module loader and its configuration.

也就是说，如 Toby 所述，尝试将jQuery插件与React组件结合通常是不可靠和棘手的，因此请继续小心.

That said, as Toby mentioned, trying to combine jQuery plugins with React components is often unreliable and tricky, so proceed with caution.

这篇关于React.js:使用React.js的jQuery自定义内容滚动条的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！