[英]Graphql, react-apollo how to transfer variable to query at loading component state
我有一個簡單的react組件,必須在用戶提出時從服務器加載數據。 問題是我不知道如何傳輸動態變量speakerUrl並在組件加載狀態之前訪問它。 當然我可以從this.props.params
訪問它,但是組件未加載,當我進行graphql查詢時我無法訪問它。 查詢 - 當我QuerySpeaker
設置url變量時, QuerySpeaker
工作正常。
路由器
<Route path="/speaker/:speakerUrl" component={SpeakerPage} />
組件 - SpeakerPage
import React from 'react';
import { graphql } from 'react-apollo';
import { QuerySpeaker } from '../redux/graphql/querys';
class SpeakerPage extends React.Component {
render( ) {
console.log( this.props );
return (
<div className="ui container">
<div className="ui grid">
<div className="row">
Hello
</div>
</div>
</div>
)
}
}
export default graphql(QuerySpeaker, {
options: ({ url }) => ({ variables: { url } }) <- here is my problem, how can i set this url variable?
})( SpeakerPage );
基於react-apollo
文檔 ,傳遞給options
函數的參數是傳遞給組件的props對象。 當react-router
呈現你的組件時,它會將params
作為prop傳遞給它。 這意味着params
應該是傳遞給options
函數的對象的屬性。
export default graphql(QuerySpeaker, {
options: (props) => ({ variables: { url: props.match.params.speakerUrl } })
})( SpeakerPage );
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.