ReactJSページの変更を検出する

Question

私はReactJSを初めて使うので、それを使用しているサイトで実験しています。今、私はページURLに基​​づいてAPIへのAJAX呼び出しをしようとしています。問題は、リンクがクリックされるたびにページ変更が検出されないためにコードが壊れてしまうことです。私の現在のアプローチは、すべてのリンクのクリックイベントをリッスンし、ページがロードされているときに表示される2つのセレクタをピギーバックすることです（pageLoading - 読み込みとpageLoading - 終了）。単一ページアプリケーションのページ変更を検出するためのより良い方法はありますか？状況の参照は実験的なものなので、私はサーバーにアクセスできません。私の現在のコードアプローチは以下の通りです。

//When any link on the page is clicked 
document.body.onclick = function(e){ 
    e = e || event; 
    var from = findParent('a',e.target || e.srcElement); 
    if (from){ 
    //check if pageLoading--finished ran then make an AJAX request 
    console.log(__reactContent['url']); 
    } 
} 
//find first parent with tagName [tagname] 
function findParent(tagname,el){ 
    if ((el.nodeName || el.tagName).toLowerCase()===tagname.toLowerCase()){ 
    return el; 
    } 
    while (el = el.parentNode){ 
    if ((el.nodeName || el.tagName).toLowerCase()===tagname.toLowerCase()){ 
     return el; 
    } 
    } 
    return null; 
} 

Answer 1

setStateを試してみてください。そのように反応すると、ページの変更やイベントの処理が行われます。ここでは、新しいノートをノート配列に追加する簡単な例を示します。いくつかの詳細情報については

addNote =() => { 
     this.setState({ 
      notes: this.state.notes.concat([{ 
       id: uuid.v4(), 
       task: 'new task' 
      }]) 
     }) 
    } 

https://facebook.github.io/react/docs/interactivity-and-dynamic-uis.html