添加分解反應路由器

在反應的路由器，有任何方法從可以在Router.run函數內被拾取路徑清晰度傳遞特性？我想要針對特定路線啓動特定的操作。也許這樣的事情：添加分解反應路由器

<Route handler={someComponent} resolve={someAction} />

在Router.Run我想要執行給定的行動在resolve中定義。有沒有辦法做到這一點？

之所以這樣做這是爲了確保每個途徑可以實例化服務電話（從定義的動作），以確保該商店有需要這條路線的數據。在組件中做這件事也是一種可能性，我們現在面臨的問題是，同一路由中的多個組件需要相同的數據，這使得它多次向API請求數據，並且還觸發了從這些調用中引入的每個結果的重新渲染。

來源

2015-06-10 thsorens

你可以做這樣的事情在陣營路由器通過組件類添加static（使用createClass）或屬性（使用ES6類時），然後做出反應路由器執行它們。

var Component1 = React.createClass({ 
    statics: fetchData: function(params) { 
    return API.getData(params); 
    }, 

    // ... 
}); 

class Component2 extends React.Component { 
    // ... 
} 

Component2.fetchData = (params) => API.getData(params);

然後，當你運行你的路由器，尋找有fetchData靜態方法，並調用它的所有匹配的路由。我們將在這裏假設fetchData（因此API.getData）返回一個承諾：（詳情請參閱this React Router example）

Router.run(routes, function(Root, state) { 
    var data = {}; 

    var routesWithFetchData = state.routes.filter(function (route) { 
    return route.handler.fetchData 
    }); 

    var allFetchDataPromises = routesWithFetchData.map(function (route) { 
    return route.handler.fetchData(state.params).then(function (routeData) { 
     data[route.name] = routeData; 
    }); 
    }); 

Promise.all(allFetchDataPromises).then(function() { 
    React.render(<Root data={data} />, container); 
    }); 
});

可以解決，確保「多個組件獲取相同的數據」的問題API模塊將捕獲相同數據的請求併爲其分配相同的承諾。僞代碼：

API = { 
    getData: function(params) { 
    if (requests[params]) { 
     return requests[params]; 
    } else { 
     request[params] = new Promise(function(resolve, reject) { 
     // fetch data here 
     }); 
    } 
    } 
};

來源

2015-06-10 15:40:49

它不一定是承諾或servicecalls被觸發，但我明白你的觀點。擴展它是否可以直接在路由標記中添加一些內容（動作或其他道具）？由於每條路線都需要發起自己的行動。就像我與<例如路由解決 – thsorens

@thsorens我不是肯定的附加屬性''在做任何事情都（其實我不能看到他們的任何地方，甚至堅持）。 –

我給你正確的答案，雖然它並沒有完全解決我需要的東西，我想限制在於react-router庫。你解決方案可能會工作，雖然它有點不同的方法:) – thsorens

添加分解反應路由器

回答

相關問題