Запрос RTK: доступ к кэшированным данным вне компонента реакции

Question

Мы находимся в процессе интеграции запроса RTK в наше приложение.

Наша текущая «архитектура» выглядит следующим образом:

Все действия бизнес-логики написаны внутри сервисов, которые представляют собой простые классы JS.
Эти службы передаются с использованием контекста реакции, чтобы дерево компонентов могло вызывать функции служб.

На данный момент эти службы напрямую обращались к хранилищу redux для выполнения соответствующей логики.

Теперь, когда мы переходим к RTK, доступ к RTK-кешу из службы менее тривиален:
насколько я понимаю, единственный способ получить к нему доступ - использовать функцию выбора соответствующей конечной точки.

Дело в том, что этот метод является «фабрикой селекторов», и использование его вне компонента реакции не кажется правильным.

Вот пример:

      class TodoService {
   getTodoTitle( todoId: string ) {
     // This doesn't looks the right way to do it
     const todoSelector = api.endpoints.getTodo.select( {id: todoId } );
     const todo = todoSelector( state )
     return todo.data.title
   }
}

Есть ли способ безопасно реализовать следующий код

      class TodoService {
   getTodoTitle( todoId: string ) {
      // Is there any way to do that kind of call ?
      const todoEntry = api.endpoints.getTodo.getCacheEntry( {id: todoId } );
      return todoEntry.data.title
   }
}

Я предполагаю, что ответ - «нет», и мне нужно реорганизовать всю нашу архитектуру, но перед этим я хотел бы убедиться, что альтернативного подхода нет.

Обратите внимание, что я мог бы самостоятельно создать ключ входа в кеш, но это тоже не похоже на надежный подход ...

Answer 1

Дело в том, что вы не хотите просто получать запись в кеше - селектор делает для вас немного больше, чем просто это. Так что давайте просто остановимся на «пожалуйста, используйте селектор» и «мы не будем добавлять другой способ сделать это», потому что селекторы - это то, как ваш код должен постоянно взаимодействовать с Redux - реагировать или нет.

Если вы не вызываете этот код из React, где вам понадобится стабильная ссылка на объект, он и так хорош. Фабрика селекторов создаст новый селектор, и, таким образом, вы получите незарегистрированный результат. Это не идеально, но если вы не полагаетесь на ссылочное равенство, это также совсем не повредит.

Если вы хотите иметь ссылочное равенство, вам придется каким-то образом сохранить селектор, возможно, как свойство класса.

Возможно что-то вроде этого:

      class TodoService {
   getSelectorForTodo(todoId: string) {
     if (this._lastId !== todoId) 
       this._lastSelector = api.endpoints.getTodo.select( {id: todoId } )
     return this._lastSelector
   }

   getTodoTitle( todoId: string ) {
     const todo = this.getSelectorForTodo(todoId)(state)
     return todo.data.title
   }
}