訪問服務器端渲染初始數據檢索中的react-router參數

我覺得我錯過了一些非常明顯的東西。 FWIW，我在服務器端使用React，Redux，React-Router，React-Router-Redux綁定和Express。訪問服務器端渲染初始數據檢索中的react-router參數

我正在處理我的第一個通用反應應用程序，大部分工作都很好。我有一個操作，「fetchData」在服務器上運行並在最初呈現頁面之前解析承諾，然後客戶端檢查是否需要獲取數據。

所有這一切正如我所願。

但是，當我需要在呈現頁面之前訪問服務器上的路由器中的參數時，我遇到了一些麻煩。

一個例子是：

http://myapp.com/update/:updateid

如何正確地訪問updateid參數在我最初的fetchData行動？我已經在客戶端使用上下文對象成功完成了這一任務 - 但我在這裏的位置有點困惑。

我可以看到它在renderProps傳遞給我的RouterContext，我只是不知道如何抓住它。我是用React-Router做還是做快件？

（我設法通過執行以下代碼暫時解決了，但我知道這是真的很可怕，因此爲什麼我想要做正確的話）

// Grab the requested user from the router/url 
const pathname = state.getIn(['routing', 'locationBeforeTransitions', 'pathname']); 

// Strip out /update/ from the route string 
const updatePath = '/update/'; 
let pathnameWithoutTrailing = pathname; 
if (pathname.endsWith('/') || pathname.endsWith('#') || pathname.endsWith('?')) { 
    pathnameWithoutTrailing = pathname.slice(0, -1); 
} 
requestedUpdate = pathnameWithoutTrailing.substr(updatePath.length);

來源

2016-11-06 intoxxx

如果我正確理解你的問題。您可以使用this.props.params.updateId訪問容器中的updateId。您需要將updateId作爲參數傳遞給fetchData操作。像這樣：

componentWillMount() { 
    this.props.dispatch(fetchData(this.props.params.updateId)) 
}

來源

2016-11-06 02:41:53 dahveed707

我正在尋找服務器運行API調用並獲取數據之前，它呈現。讓服務器渲染頁面，然後讓客戶端將信息發送到服務器似乎沒有什麼意義，因爲服務器應該能夠在客戶端知道它之前訪問參數。我發佈的示例代碼工作正常，因爲它在頁面呈現之前正確發送API請求並在首次加載時可用，但我知道必須有更好的方式來訪問服務器上的路由器道具。 – intoxxx

如果我在我的服務器代碼中使用console.log renderProps，我可以看到我想用作其一部分的部分，如下所示： {path：'update /：updateid'，getComponent：[Function：getComponent]} ]， PARAMS：{updateid：「jor74n6lsgWHk」}，所以基本上，我想使用服務器端的行動，PARAM，而不必首先從客戶端去得到它 – intoxxx

訪問服務器端渲染初始數據檢索中的react-router參數

回答

相關問題