web-dev-qa-db-ja.com

ReactのJqueryが定義されていません

こんにちは、私はajaxリクエストを受け取りたいだけですが、問題はjqueryがReactで定義されていないことです。 Reactバージョンは14.0です

エラーメッセージ

 Uncaught ReferenceError: $ is not defined

2つのファイルがあります：

index.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>
        );
    }
}
javascriptjqueryajaxreactjs
49
Machycek

次のように、プロジェクトにjQueryを追加してみてください

npm i jquery --save

または、バウアーを使用する場合

bower i jquery --save

それから

import $ from 'jquery';
268
Alexander T.

ajaxリクエストを受け取りたいだけですが、問題はjQueryがReactで定義されていないことです

それからそれを使用しないでください。 Fetch を使用して Reactでポリフィルを取得する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
  });
5
mplungjan

次のようにするより簡単ではありません：

1-プロジェクトにjqueryをインストールします。

yarn add jquery

2- jqueryをインポートし、DOMで遊んでください：

import $ from 'jquery';
0
MUSTAPHA GHLISSI

ご注意：矢印関数を使用する場合、const that = this partは必要ありません。次のようになります。

fetch('http://jsonplaceholder.typicode.com/posts') 
  .then((response) => { return response.json(); }) 
  .then((myJson) => { 
     this.setState({data: myJson}); // for example
});
0
Zach Robichaud