Relay Modern:在 optimisticUpdater 中删除记录
Relay Modern: delete record in optimisticUpdater
在我的应用程序中,我有一个 mutation
,我想在其中使用 optimisticUpdater
在服务器响应之前更新视图。为此,我需要从列表中删除一些记录到中继存储中,就像这样:
optimisticUpdater: storeProxy => {
storeProxy.delete(recordDataID)
}
问题是中继不会删除记录,但会转换null
中的记录。
这可能很烦人,因为我每次在我的应用程序中使用它时都必须过滤列表。
有人知道如何删除记录吗?
谢谢
您必须从列表中删除您的记录
optimisticUpdater: (store) => {
const listOfRecords = store.getRoot().getLinkedRecords('list')
const newList = listOfRecords.filter(record => record.getDataID() !== recordDataID)
store.getRoot().setLinkedRecords(newList, 'list')
}
在此示例中,我假设您的列表位于图表的根部
如果您使用 @connection
修饰查询,则可以使用 ConnectionHandler
轻松删除记录:
const query = graphql`query WidgetListQuery {
widgets(first: 10) @connection(key: "WidgetList_widgets") {
...
}
}`
optimisticUpdater(store) {
const widgets = ConnectionHandler.getConnection(store.getRoot(), 'WidgetList_widgets');
ConnectionHandler.deleteNode(widgets, deleted_widget.id)
}
在我的应用程序中,我有一个 mutation
,我想在其中使用 optimisticUpdater
在服务器响应之前更新视图。为此,我需要从列表中删除一些记录到中继存储中,就像这样:
optimisticUpdater: storeProxy => {
storeProxy.delete(recordDataID)
}
问题是中继不会删除记录,但会转换null
中的记录。
这可能很烦人,因为我每次在我的应用程序中使用它时都必须过滤列表。
有人知道如何删除记录吗? 谢谢
您必须从列表中删除您的记录
optimisticUpdater: (store) => {
const listOfRecords = store.getRoot().getLinkedRecords('list')
const newList = listOfRecords.filter(record => record.getDataID() !== recordDataID)
store.getRoot().setLinkedRecords(newList, 'list')
}
在此示例中,我假设您的列表位于图表的根部
如果您使用 @connection
修饰查询,则可以使用 ConnectionHandler
轻松删除记录:
const query = graphql`query WidgetListQuery {
widgets(first: 10) @connection(key: "WidgetList_widgets") {
...
}
}`
optimisticUpdater(store) {
const widgets = ConnectionHandler.getConnection(store.getRoot(), 'WidgetList_widgets');
ConnectionHandler.deleteNode(widgets, deleted_widget.id)
}