Question

我使用react-create-app命令创建了一个应用程序，我使用了反应16.我想使用katrik-v fileinput（一个jquery插件）。那是我的代码：

import React, { Component } from 'react';
import { Grid, Cell }  from 'react-foundation';
import Header from './Heaader';
import $, { jQuery } from 'jquery';

class New extends Component {

componentDidMount(){
    $(document).find('#root').find('#test-upload').fileinput();
}


render(){
    return (
        <div>
          <Grid type="x">
               <Cell medium={2} large={2} >
                    <label htmlFor="image" className="text-right middle">
                           <p className="form-label">Images</p></label>
               </Cell>
               <Cell medium={8} large={8}>
                    <div className="file-loading">
                        <input id="test-upload" ref='fff' type="file" 
                        multiple />
                    </div>
               </Cell>
         </Grid>
      </div>)
}
}
export default New;

当我在index.js中调用它时：

ReactDOM.render(<App />, document.getElementById('root'));

我正面临这个错误：

类型错误：   __WEBPACK_IMPORTED_MODULE_4_jquery ___默认（...）（...）。找到（...）。找到（...）。的FileInput   不是一个功能。
           $（document）.find（＆＃39;＃root＆＃39;）。find（＆＃39; #test-upload＆＃39;）。fileinput（）

问题是什么？一般来说，如何将这两者合并？（一个jquery插件和反应应用程序）

Answer 1

为了将jQuery插件与React应用程序一起使用，你应该将jQuery从webpack进程中拉出来。

将jQuery和插件包含为静态文件，或使用<script>中的public/index.html标记通过CDN。

要在React文件中使用jQuery，请添加

/* global $ */

将您的类文件视为导入行。

使用带有jquery插件的React应用程序时出现TypeError

1 个答案: