ReactDOM.render裏面$ .post錯誤回調

我是新來的React，並嘗試呈現錯誤消息時POST請求返回錯誤。事情是這樣的：

$.post({ 
    url: `/abc/xyz/`, 
    cache: false, 
    dataType: 'json', 
    data: data, 
    contentType: 'application/json; charset=utf-8', 
    success: function (response) { 
     ... 
    }, 
    error: function (response) {  
     ReactDOM.render(
      <div> 
       <p>response.statusText</p> 
      </div>, 
      document.getElementById('errorDialog') 
     ); 
    } 
});

然而，當我嘗試運行它，在控制檯中我不斷收到一個錯誤：

Uncaught Error: Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.

仔細檢查表明是在該行ReactDOM.render錯誤裏面的問題回電話。這不能在回調中使用嗎？我嘗試在外部使用它，但可能由於回調函數的異步性質，它不起作用。有人知道我如何解決這個問題嗎？提前致謝！

來源

2016-09-05 user3033194

如果您使用的是React，爲什麼還在使用jQuery？幾乎所有它的React和普通模塊都是這樣做的。對於發佈等內容，請使用通用模塊，如'superagent'或獲取API ......至於錯誤：根據其文本，第一步是不要縮小代碼，以便可以看到*錯誤在哪裏。 –

它看起來像你用$ .ajax翻轉$ .post。你的函數格式是$阿賈克斯，而不是$。員額

http://api.jquery.com/jQuery.post/

來源

2016-09-05 21:16:34

首先看起來像你所得到的Minified exception occurred錯誤，因爲ReactDOM沒有找到與errorDialog的ID的元素，接下來你根據您的設置使用$.post而不是$.ajax ...我建議您爲statusText設置一個狀態並保存您到達的值。我爲你準備了一個例子。 ES6：

import React, { Component } from 'react'; 

export default class App extends Component { 

    constructor() { 
    super(); 
    this.state = { 
     statusText: null 
    }; 
    } 

    componentDidMount() { 
    $.ajax({ 
     type: 'POST' 
     url: `/abc/xyz/`, 
     cache: false, 
     dataType: 'json', 
     data: data, 
     contentType: 'application/json; charset=utf-8', 
     success: function (response) { 
      console.log("$.post success", response); 
     }, 
     error: function (response) { 
      this.setState({ 
      statusText: response.statusText 
      }); 
     } 
    }.bind(this)); 
    } 

    render() { 
    const { statusText } = this.state; 
    return (
     <div> 
     <p>{statusText}</p> 
     </div> 
    ) 
    } 
} 

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

來源

2016-09-05 21:21:13

ReactDOM.render裏面$ .post錯誤回調

回答

相關問題