Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/27.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Reactjs 如何使用refetchQueries with reason apollo?_Reactjs_Graphql_Apollo_Reason_Reason React - Fatal编程技术网

Reactjs 如何使用refetchQueries with reason apollo?

Reactjs 如何使用refetchQueries with reason apollo?,reactjs,graphql,apollo,reason,reason-react,Reactjs,Graphql,Apollo,Reason,Reason React,我正在使用reason apollo,在尝试设置refetchQueries时遇到问题。我的设置与swapi示例非常相似。我有一个列表和一个表单,可以通过一个变体添加一个新项目。变异成功后,我想重新提取列表中的项目。我创建新项目的代码如下所示(跳过一些不相关的ui代码): module CreateFilm=[%graphql {| 创建电影($name:String!,$favorite:Boolean!,$rating:Int!,$ratedOn:DateTime!){ createFilm

我正在使用reason apollo,在尝试设置
refetchQueries
时遇到问题。我的设置与swapi示例非常相似。我有一个列表和一个表单,可以通过一个变体添加一个新项目。变异成功后,我想重新提取列表中的项目。我创建新项目的代码如下所示(跳过一些不相关的ui代码):

module CreateFilm=[%graphql
{|
创建电影($name:String!,$favorite:Boolean!,$rating:Int!,$ratedOn:DateTime!){
createFilm(名称:$name,收藏夹:$favorite,评级:$rating,ratedOn:$ratedOn){
身份证件
最喜欢的
名称
评级
}
}
|}
];
模块CreateFilmMutation=ReasonApollo.CreateMutation(CreateFilm);
类型状态={
最喜欢的:布尔,
评级:int,
};
类型动作=
|切换收藏夹
|更新(int);
让组件=ReasonReact.reducerComponent(“FilmNew”);
让make=\u children=>{
…组件,
initialState:()=>{收藏夹:true,评级:5},
减速器:动作=>
开关(动作){
|togglefavorite=>(
state=>ReasonReact.Update({…state,favorite:!state.favorite})
)
|更新(新评级)=>(
state=>ReasonReact.Update({…state,rating:newRating})
)
},
呈现:({state,send})=>{
现在让我们=Js.Date.make()|>Js.Date.toISOString |>Js.Json.string;
让我们来看看新电影=
制作电影(
~name=“临时测试”,
~rating=state.rating,
~favorite=state.favorite,
~ratedOn=现在,
(),
);
...(
(突变,_结果)=>
{
ReactEventRe.Synthetic.preventDefault(事件);
突变(
~refetchQueries=[|“所有电影”|],
~variables=newFilm##variables,
(),
)
|>忽视;
}
)>
发送(切换收藏夹))
/>
(“是宠儿”|>ReasonReact.string)
)
;
},
};

该电影被成功添加,当页面刷新时,我可以在列表中看到它(使用
allFilms
查询)。但是
refetchquerys
似乎没有任何效果。我的后端使用graph.cool,类似于文档中的swapi示例。感谢您的帮助,谢谢

问题不在于突变,而在于我想要重新蚀刻的查询——它缺少graphql操作名称
module CreateFilm = [%graphql
  {|
  mutation createFilm($name: String!, $favourite: Boolean!, $rating: Int!, $ratedOn: DateTime!) {
      createFilm(name: $name, favourite: $favourite, rating: $rating, ratedOn: $ratedOn) {
          id
          favourite
          name
          rating
      }
  }
|}
];

module CreateFilmMutation = ReasonApollo.CreateMutation(CreateFilm);

type state = {
  favourite: bool,
  rating: int,
};

type action =
  | ToggleFavourite
  | UpdateRating(int);

let component = ReasonReact.reducerComponent("FilmNew");

let make = _children => {
  ...component,
  initialState: () => {favourite: true, rating: 5},
  reducer: action =>
    switch (action) {
    | ToggleFavourite => (
        state => ReasonReact.Update({...state, favourite: ! state.favourite})
      )
    | UpdateRating(newRating) => (
        state => ReasonReact.Update({...state, rating: newRating})
      )
    },
  render: ({state, send}) => {
    let now = Js.Date.make() |> Js.Date.toISOString |> Js.Json.string;
    let newFilm =
      CreateFilm.make(
        ~name="Temporary test",
        ~rating=state.rating,
        ~favourite=state.favourite,
        ~ratedOn=now,
        (),
      );
    <CreateFilmMutation>
      ...(
           (mutation, _result) =>
             <form
               onSubmit=(
                 event => {
                   ReactEventRe.Synthetic.preventDefault(event);
                   mutation(
                     ~refetchQueries=[|"allFilms"|],
                     ~variables=newFilm##variables,
                     (),
                   )
                   |> ignore;
                 }
               )>
               <input
                 className="toggle"
                 _type="checkbox"
                 checked=state.favourite
                 onChange=((_) => send(ToggleFavourite))
               />
               ("is favourite" |> ReasonReact.string)
               <input _type="submit" value="Submit" />
             </form>
         )
    </CreateFilmMutation>;
  },
};