릴레이 연결 요소에 대한 추가 정보

Question

Relay와 Graphql을 사용하고 있는데 연결에서 한 개체에 더 많은 필드를 가져 오는 방법을 알아내는 데 어려움이 있습니다.

한다고 가정 우리가 보는 사람의 작업 목록 채우려면 다음과 같은 쿼리가 :

viewer { 
    id 
    tasks(first:10) { 
    edges { 
     node { 
     id 
     name 
     } 
    } 
    } 
} 

사용자가 다음 목록에서 하나를 선택

, 내가 선택한 하나 이상의 필드를 가져 오려는을. 여기

내 생각은 다음과 같습니다

1. 내가 "작업"이라고 그 입력으로 ID를 취하고 단지 하나의 작업을 반환 뷰어 개체에 새 필드/메소드를 구현합니다. 이 답변처럼 : https://stackoverflow.com/a/40712653/5820184
2. 누락 된 데이터를 가져 오는 데 노드 루트 쿼리를 사용하십시오. (릴레이에서이 작업을 수행하는 방법을 잘 모르겠습니다. 두 쿼리 모두에 루트 컨테이너를 종속시키지 않습니까?)
3. 연결에 ID를 입력 한 다음 해당 작업 하나만 반환하도록합니다.

지금은 그래프에 하나의 요소를 가져 오는 "함수"를 추가하여 전체 "그래프"모델 생각에 어긋나는 것처럼 보입니다.

숫자 2의 경우, 노드 루트 쿼리를 사용하는 것이 내부 릴레이 것 인 것처럼 보이기 때문에 좋은 방법이라고 확신하지 못합니까?

숫자 3은 목록보기에 영향을 줄 수있는 목록을 필터링하는 종류이기 때문에 가능한 해결책인지 모르겠습니까?

UPDATE

우리는 목록에서 반환을 입력으로 하나 개의 요소 ID를 취 각 연결에 대한 필드를 만들기까지했다. 이것은 Graphcool, GitHub 및 다른 사람들이 끝점에서 수행하는 방식에서 영감을 얻었습니다. 나를 올바른 방향으로 가리켜 주셔서 감사합니다.

Answer 1

두 번째 방법은 실제로 official Relay docs에 언급되어 있습니다. 귀하의 경우에는

, 당신은이 같은 특정 작업에 대한 추가 쿼리를 만들 수 :

는

query SpecificNode { 
    node(id: "task-id") { 
    id 
    ... on Task { 
     name 
     # more fields 
    } 
    } 
} 

Graphcool의 릴레이 API는 fetch one node of a specific model에 추가 최상위 쿼리가 포함되어 있습니다. 귀하의 사례에 대한 문의는 다음과 같습니다 :

query SpecificTask { 
    Task(id: "task-id") { 
    id 
    name 
    # more fields 
    } 
} 

Answer 2

@include 지시어를 사용하여이를 수행 할 수 있습니다. 계전기가 모든 것을 처리합니다! taskSelected는 릴레이 변수입니다 @include(if: $taskSelected)를 사용하여 additionalInfo의

export default Relay.createContainer(Task, { 
    initialVariables: { 
    taskSelected: false, 
    }, 
    fragments: { 
    viewer:() => Relay.QL` 
     fragment on Viewer { 
     id 
     tasks(first:10) { 
      edges { 
      node { 
       id 
       name 
       additionalInfo @include(if: $taskSelected) { 
       where, 
       when, 
       who, 
       priority 
       } 
      } 
      } 
     } 
     } 
    `, 
    }, 
}); 

가져 오기 조건부 만들어지고 아래 초기화 :

별도의 반작용 구성 요소로 task를 디자인 한 가정 내 보낸 릴레이 컨테이너는 다음과 같이 표시됩니다 initialVariables 속성

링크가 죽었하고 관련 정보가 이동되었습니다처럼

this.props.relay.setVariables({ taskSelected: true });