在单个节点的乐观响应中，阿波罗做出反应，将所有平面列表项目重新投放？

问题描述

我想在react native的flatlist中的单个节点上实现乐观响应，这是flatlist的父级：

interface TodosData {
  todos: Todo[];
}

const GET_TodoS = gql`
  query GetTodos {
    todos {
      id
      complete
    }
  }
`;
const RenderFL = () => {
  const { loading,data,error } = useQuery<TodosData>(GET_TodoS);
  if (loading) return <ActivityIndicator />;
  if (error) return null;
  return (
    <StyledFlatList
      exTradata={data}
      data={(data && data.todos) || []}
      renderItem={({ item }) => <Item id={item.id} complete={item.complete} />}
      keyExtractor={(item) => `${item.id}`}
    />
  );
};

现在我想以乐观的响应切换属性为false或true：

interface ItemProps {
  id: string;
  complete: boolean;
}
const UPDATE_Todo = gql`
  mutation Toggletodo($id: String!) {
    toggletodo(id: $id) {
      id
      complete
    }
  }
`;
const Item: FC<ItemProps> = ({ id,complete }) => {
  const [tI,settI] = useState(false);
  const [v] = useState(`${id}`);
  const [savetodo,{ error,loading }] = useMutation<
    { updatetodo: Todo },{ id: string }
  >(
    // { rocket: NewRocketDetails }
    UPDATE_Todo,{
      variables: { id }
    }
  );
  if (loading) return <ActivityIndicator />;
  if (error) return null;
  return (
    <View style={[styles.item]}>
      <pressable
        onPress={() => {
          savetodo({
            optimisticResponse: {
              updatetodo: {
                id,complete: !complete,},});
        }}
        style={{ backgroundColor: "blue" }}>
        <Text style={[styles.title,{ color: complete ? "red" : "green" }]}>
          {v}
        </Text>
      </pressable>
    </View>
  );
};

但是重新提交单位列表中的所有其他项目？您可以观察到动画发生得很快，这很奇怪，我只想在平面列表中切换具有乐观响应的道具，帮助？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）