首页 > 解决方案 > 当我更新 mobX 状态并使用观察者更新视图时抛出“MobXException”

问题描述

我正在尝试使用 mobX 状态管理来进行颤振。但是每当我直接更新我的@observable 状态而不是调用@action 修饰的方法时,它都会抛出“MobXException”

下面的代码会给你一个正确的想法。

反镖

import 'package:mobx/mobx.dart';

part 'counter.g.dart';

class Counter = CounterBase with _$Counter;

abstract class CounterBase implements Store {
  @observable
  int value = 0;

  @action
  void increment() {
    value++;
  }
}

主要.dart

import 'package:flutter/material.dart';
import 'package:flutter_mobx/flutter_mobx.dart';
import './counter.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Counter",
      home: CounterExample(),
    );
  }
}

class CounterExample extends StatelessWidget {
  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: 50),
                  )),
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: () {
            // _counter.increment(); // WORKING !!
            _counter.value = _counter.value+1; // NOT WORKING !!
          },
          tooltip: 'Increment',
          child: const Icon(Icons.add),
        ),
      );
}

使用增量方法是有效的,但为什么即使对于一些简单的状态改变我也需要另一种方法?为什么生成的setter不够用?

标签: dartfluttermobx

解决方案


但是每当我直接更新我的@observable 状态而不是调用@action 修饰的方法时,它都会抛出“MobXException”

这是一个特点。MobX 有目的地防止你在action之外改变 observables 。

而是将该逻辑移动到商店的方法中。


推荐阅读