Mobx: как ререндерить контейнер, передающий дочернему компоненту observable из стора?

Question

[Worddoc]

Mobx ререндерит observer компонент только тогда, когда в этом компоненте происходит обращение к observable структуре. Т.е. если, разделить компонент на Контейнер и Презентационный компонент, Контейнер не ререндерится, соответственно Презентационный компонент не получает обновленные данные.

import React, { Component } from 'react';
import { observer, inject } from 'mobx-react';

import TodoView from './Todo-view';

@inject('TasksModel')
@observer
class Todo extends Component {
    render() {
        const {
            TasksModel: { tasks },
        } = this.props;
        return (
            <TodoView tasks={tasks} />
        );
    }
}

export default Todo;

Но если формально обратиться внутри render метода Контейнера к observable структуре, например, через tasks.length;, то он посчитает, что observable используется, а observer будет ререндерить контейнер.

Вопрос: как позволить контейнеру ререндериться, если в render они будут использоваться только передачи их дочернему компоненту?

Comments

[Павел Диденко]

Что-то мне кажется вы несете какую-то дичь. Выложите пример в песочницу

Answer 1

[Robur]

Добавьте @observer на TodoView
А лучше и @inject туда же.
И выкиньте ваш Todo.
И не перемешивайте все концепции которые вы встретили в интернете в одном коде.

Comments

[Worddoc]

Презентационные вьюхи не должны зависеть от источника данных. Кстати, ваш совет обернуть TodoView в observer помог. Спасибо!

[Robur]

Вот для того чтобы они не зависели и придуман inject.
А вообще конечно ваше право делать как угодно, хоть фабрики фабрик, рад что все заработало.