javascript-未定义React中的jQuery

嗨,我只是想接收一个ajax请求,但是问题是在React中没有定义jquery。 React版本是app.js

错误信息

 Uncaught ReferenceError: $ is not defined

我有两个文件:

app.js

import React from 'react'; 
import { render } from 'react-dom';
import App from './containers/App';  

const root = document.getElementById('root');  

render( 
  <App source='https://api.github.com/users/octocat/gists' />, 
  root
);

app.js

import React, { Component } from 'react';

export default class App extends Component {

    componentDidMount() {
        const { source } = this.props;

        console.log($); // throws error
    }

    render() {
        return (
            <h1>Hey there.</h1>
        );
    }
}
Machycek asked 2020-01-21T13:49:54Z
5个解决方案
276 votes

尝试将jQuery添加到您的项目中,例如

npm i jquery --save

或者如果您使用凉亭

bower i jquery --save

然后

import $ from 'jquery'; 
Alexander T. answered 2020-01-21T13:50:30Z
5 votes

我只想接收一个ajax请求,但是问题是jQuery没有在React中定义。

然后不要使用它。 使用Fetch并查看React中的Fetch polyfill无法在IE 11中完全正常工作,以查看使其运行的替代方法示例

像这样

const that = this; 
fetch('http://jsonplaceholder.typicode.com/posts') 
  .then(function(response) { return response.json(); }) 
  .then(function(myJson) { 
     that.setState({data: myJson}); // for example
  });
mplungjan answered 2020-01-21T13:50:59Z
0 votes

请注意:如果使用箭头功能,则不需要const =这部分。它可能看起来像这样:

fetch('http://jsonplaceholder.typicode.com/posts') 
  .then((response) => { return response.json(); }) 
  .then((myJson) => { 
     this.setState({data: myJson}); // for example
});
Zach Robichaud answered 2020-01-21T13:51:19Z
0 votes

像这样做并不容易:

1-在您的项目中安装jquery:

yarn add jquery

2-导入jquery并开始使用DOM:

import $ from 'jquery';
MUSTAPHA GHLISSI answered 2020-01-21T13:51:48Z
-7 votes

在h1标签中添加“ ref”:

<h1 ref="source">Hey there.</h1>


const { source } = this.props;更改为const { source } = this.refs;

Edhar Dowbak answered 2020-01-21T13:52:16Z
translate from https://stackoverflow.com:/questions/33351288/jquery-in-react-is-not-defined