How can I update an object inside an item using Mobx ObservableList

Question

I have an Observablelist of a specific type, when I change some property of this object by some @action function my list doesn't change, it just changes if I go back to the screen and go to enter again in the list's screen.

Is there some way that these changes happen on screen?

Answer 1

You probably didn't put your page code inside the Observer widget.

https://pub.dev/documentation/flutter_mobx/latest/flutter_mobx/Observer-class.html

class CounterExample extends StatefulWidget {
  const CounterExample({Key key}) : super(key: key);

  @override
  _CounterExampleState createState() => _CounterExampleState();
}

class _CounterExampleState extends State<CounterExample> {
  final _counter = Counter();

  @override
  Widget build(BuildContext context) => Scaffold(
        appBar: AppBar(
          title: const Text('Counter'),
        ),
        body: Center(
          child: Observer(
              builder: (_) => Text(
                    '${_counter.value}',
                    style: const TextStyle(fontSize: 20),
                  )),
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: _counter.increment,
          tooltip: 'Increment',
          child: const Icon(Icons.add),
        ),
      );
}