Sync redux-saga и реагировать на жизненный цикл

Question

Реагирующие компоненты имеют свой жизненный цикл (componentWillMount, componentDidMount и т. Д.), А также сага имеет собственный жизненный цикл (работает как промежуточное ПО).

Есть ли способ синхронизировать эти два жизненных цикла?

Я думаю, что это может быть проблемой, когда мы хотели бы обеспечить некоторые компоненты с авторизацией (на нескольких уровнях доступа)

Answer 1

Это возможно. Вы можете создать HOC (компонент более высокого порядка), который перехватывает события жизненного цикла React и отправляет действия, сопоставленные им для сокращения-саги. В вашей саге вы можете использовать take для синхронизации жизненного цикла и управления потоком.

Пожалуйста, дайте мне знать, если вам нужен рабочий пример. Я добавлю пример к my repository на Github.

// HOC 
import Lifecycle from '...'; 

// Target component 
class SecretPane extends Component { 
    // ... 
} 

// Export wrapped SecretPane component 
export default Lifecycle(SecretPane); 

// ... 

function* lifecycle() { 
    yield take(COMPONENT_WILL_MOUNT); 

    // Do something before mounted 

    yield take(COMPONENT_DID_MOUNT); 

    // Do something after mounted 

    yield take(COMPONENT_WILL_UNMOUNT); 

    // Do something before unmounted 
}