GraphQl Refetch并不总是在TextField清除值上工作

Question

我正在使用GraphQl查询数据库记录。我用材料图textfield创建了一个过滤器组件，并在更新过滤器值后，用refetch运行查询。

有时在清除值后，查询不会再次调用（例如，在日期字段上）。

这是我的代码：

const newDate = new Date();
const [date, setDate] = useState(newDate);

const { data, loading, error, refetch } = useQuery(GET_ALL, {
        variables: { first: 100, task: task, status: status, week: week, date: date, responsible_entity: responsible, no_incident: no_incident, site: site }, onCompleted: (
        ) => {            setItems(data.getAll)
        }
    });

<TextField
   id="dateFilter"
   type="date"
   defaultValue={dateToString(myDate)}
   variant="outlined"
   className={classes.textField}
   onChange={(e, v) => { setDate(e.target.value); refetch() }}
/>

 <Controller
                        control={control}
                        name="responsible"

                        render={({ field: { onChange, value }, fieldState: { error } }) => (
                            <Autocomplete
                                id="responsible"
                                options={responsiblesList}
                                defaultValue={{ 'DISTINCT': responsible || '' }}
                                getOptionLabel={(option) => option.DISTINCT}
                                style={{ width: 300 }}
                                className={classes.textField}

                                onInputChange={(event, newInputValue, reason) => {
                                    if (reason === 'clear') {
                                        setResponsible(null)
                                        return
                                    } else {
                                        setResponsible(newInputValue)
                                    }
                                }}
                                renderInput={(params) => <TextField {...params}
                                    label="select responsible"
                                    variant="outlined"

                                    defaultValue={responsible}
                                />}
                            />
                        )}
                    />

Answer 1

实际上，您不需要调用refetch（），因为您的查询使用date 状态。当您调用setDate（e.target.value）时，将使用更新的date召回usequery。在这种情况下，回想refetch（）就像做同样的事情两次。删除它，它可能会解决您的问题。