有问题 w/ flutter mobx RadioListTile
Having problem w/ flutter mobx RadioListTile
我在使用 mobx 和 radiobox 时遇到问题:选择时屏幕不更新。我认为这是一个愚蠢的错误,这是我的 main.dart、teste_store.dart 和 pubspec.yaml。部分文件 .g 是用 build_runner 和 mobx_codegen.
生成的
当我 运行 它时会出现一条消息:“在 Observer 的构建方法中未检测到可观察对象”。我认为 testeStore.selected 是一个可观察对象,当更改触发观察者重建时。
main.dart
import 'package:flutter/material.dart';
import 'package:flutter_mobx/flutter_mobx.dart';
import 'package:teste_flutter/teste_store.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
TesteStore testeStore = TesteStore();
@override
Widget build(BuildContext context) {
List<String> options = ["Option 1", "Option 2", "Option 3"];
return Scaffold(
appBar: AppBar(
title: Text("Test Flutter"),
),
body: Center(
child: Observer(
builder: (_){
return ListView.builder(
itemCount: options.length,
itemBuilder: (context, index) {
return RadioListTile<int>(
title: Text(options[index]),
value: index,
groupValue: testeStore.selected,
onChanged: testeStore.changeSelected,
);
},
);
}
)
),
);
}
}
teste_store.dart
import 'package:mobx/mobx.dart';
part 'teste_store.g.dart';
class TesteStore = _TesteStore with _$TesteStore;
abstract class _TesteStore with Store {
@observable
int selected = 0;
@action
void changeSelected(int newSelected) {
selected = newSelected;
}
}
pubspec.yaml
name: teste_flutter
description: A new Flutter application.
publish_to: 'none'
version: 1.0.0+1
environment:
sdk: ">=2.7.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
cupertino_icons: ^1.0.0
mobx: ^1.2.1+2
flutter_mobx: ^1.1.0+2
provider: ^4.3.2+2
dev_dependencies:
flutter_test:
sdk: flutter
build_resolvers: ^1.3.10
mobx_codegen: ^1.1.0+1
build_runner: ^1.10.2
flutter:
uses-material-design: true
编辑 1 和 2:
我把我找到的解决方案放在这里,我不应该。写在答案框中。
我看到你的 TesteStore class 来自 private
_TesteStore class。也许是这样?错误信息看起来很合理。尝试用 @observable
public 制作 class 并重新构建零件文件。
更新
- 尝试在
Observer
builder 中做中间作业
final selected = testeStore.selected;
然后使用在内部构建器中选择的新局部变量。
- 尝试使用
ListView
而不是 ListView.builder
。
- 尝试用
Observer
换行,而不是 List
,而是 RadioListTile
。
通过与@BambinoUA 交谈,我们找到了一个解决方案,只是为了进一步了解他的解决方案为何有效。
我确实将列表视图放在一个带有同级文本小部件的列中,testeStore.selected 就像一个文本,现在一切都更新了。
child: Observer(
builder: (_){
return Column(
children: [
Text(testeStore.selected.toString()),
ListView.builder(
itemCount: options.length,
itemBuilder: (context, index) {
return RadioListTile<int>(
title: Text(options[index]),
value: index,
groupValue: testeStore.selected,
onChanged: testeStore.changeSelected,
);
},
),
],
);
}
)
回到原来的代码我试着只使用 print(testeStore.selected);在 return 之前在 Observer 的构建器中并且它起作用了:
child: Observer(
builder: (_){
print(testeStore.selected);
return ListView.builder(
当我从 RadioListTile 放入 itemBuilder 时不起作用。
child: Observer(
builder: (_){
return ListView.builder(
itemCount: options.length,
itemBuilder: (context, index) {
print(testeStore.selected);
return RadioListTile<int>(
我假设 Observer 不会查看其他小部件生成器中的更改。
我在使用 mobx 和 radiobox 时遇到问题:选择时屏幕不更新。我认为这是一个愚蠢的错误,这是我的 main.dart、teste_store.dart 和 pubspec.yaml。部分文件 .g 是用 build_runner 和 mobx_codegen.
生成的当我 运行 它时会出现一条消息:“在 Observer 的构建方法中未检测到可观察对象”。我认为 testeStore.selected 是一个可观察对象,当更改触发观察者重建时。
main.dart
import 'package:flutter/material.dart';
import 'package:flutter_mobx/flutter_mobx.dart';
import 'package:teste_flutter/teste_store.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
TesteStore testeStore = TesteStore();
@override
Widget build(BuildContext context) {
List<String> options = ["Option 1", "Option 2", "Option 3"];
return Scaffold(
appBar: AppBar(
title: Text("Test Flutter"),
),
body: Center(
child: Observer(
builder: (_){
return ListView.builder(
itemCount: options.length,
itemBuilder: (context, index) {
return RadioListTile<int>(
title: Text(options[index]),
value: index,
groupValue: testeStore.selected,
onChanged: testeStore.changeSelected,
);
},
);
}
)
),
);
}
}
teste_store.dart
import 'package:mobx/mobx.dart';
part 'teste_store.g.dart';
class TesteStore = _TesteStore with _$TesteStore;
abstract class _TesteStore with Store {
@observable
int selected = 0;
@action
void changeSelected(int newSelected) {
selected = newSelected;
}
}
pubspec.yaml
name: teste_flutter
description: A new Flutter application.
publish_to: 'none'
version: 1.0.0+1
environment:
sdk: ">=2.7.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
cupertino_icons: ^1.0.0
mobx: ^1.2.1+2
flutter_mobx: ^1.1.0+2
provider: ^4.3.2+2
dev_dependencies:
flutter_test:
sdk: flutter
build_resolvers: ^1.3.10
mobx_codegen: ^1.1.0+1
build_runner: ^1.10.2
flutter:
uses-material-design: true
编辑 1 和 2: 我把我找到的解决方案放在这里,我不应该。写在答案框中。
我看到你的 TesteStore class 来自 private
_TesteStore class。也许是这样?错误信息看起来很合理。尝试用 @observable
public 制作 class 并重新构建零件文件。
更新
- 尝试在
Observer
builder 中做中间作业
final selected = testeStore.selected;
然后使用在内部构建器中选择的新局部变量。
- 尝试使用
ListView
而不是ListView.builder
。 - 尝试用
Observer
换行,而不是List
,而是RadioListTile
。
通过与@BambinoUA 交谈,我们找到了一个解决方案,只是为了进一步了解他的解决方案为何有效。
我确实将列表视图放在一个带有同级文本小部件的列中,testeStore.selected 就像一个文本,现在一切都更新了。
child: Observer(
builder: (_){
return Column(
children: [
Text(testeStore.selected.toString()),
ListView.builder(
itemCount: options.length,
itemBuilder: (context, index) {
return RadioListTile<int>(
title: Text(options[index]),
value: index,
groupValue: testeStore.selected,
onChanged: testeStore.changeSelected,
);
},
),
],
);
}
)
回到原来的代码我试着只使用 print(testeStore.selected);在 return 之前在 Observer 的构建器中并且它起作用了:
child: Observer(
builder: (_){
print(testeStore.selected);
return ListView.builder(
当我从 RadioListTile 放入 itemBuilder 时不起作用。
child: Observer(
builder: (_){
return ListView.builder(
itemCount: options.length,
itemBuilder: (context, index) {
print(testeStore.selected);
return RadioListTile<int>(
我假设 Observer 不会查看其他小部件生成器中的更改。