我实际上是想在我的Flutter应用程序中的 Map 上监听更改,该应用程序使用 Observable
包声明为 ObservableMap
.
我正在使用 StreamSubscription
来通知任何更改 . 但问题是它没有在 Map 对象内部监听 Map 内部的变化 . 我已经包含了一个例子供参考 . 如果我做错了什么或者我们必须以不同的方式做这件事,请有人告诉我 .
main.dart
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:observable_map_demo/globals.dart';
import 'package:observable_map_demo/second_screen.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Flutter Demo',
theme: new ThemeData(
primarySwatch: Colors.blue,
),
home: new MyHomePage(title: 'Observable Demo'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => new _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
Map data = new Map();
StreamSubscription changeListener;
var change;
@override
void initState(){
super.initState();
// changeListener = observeMap.changes.listen((c){
// setState((){
// data = observeMap;
// print('here');
// print(c);
//
// });
// });
change = observeMap.changes.forEach((c){
setState((){
print(c);
data = observeMap;
print('here in ');
});
}).whenComplete((){
setState((){
data = observeMap;
print('here');
});
});
}
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text(widget.title),
),
body: new Center(
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
//
new Text(data.toString()),
new MaterialButton(child: new Text('click for next screen'),onPressed: ()=>Navigator.push(context, new MaterialPageRoute(builder: (_)=> new SecondState())),)
],
),
),
// This trailing comma makes auto-formatting nicer for build methods.
);
}
}
globals.dart:
import 'package:observable/observable.dart';
ObservableMap observeMap = new ObservableMap();
second_screen.dart:
import 'package:flutter/material.dart';
import 'package:observable_map_demo/globals.dart';
class SecondState extends StatefulWidget {
@override
_SecondStateState createState() => new _SecondStateState();
}
class _SecondStateState extends State<SecondState> {
int i=0;
@override
Widget build(BuildContext context) {
return new Scaffold(
body: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children:<Widget>[
new MaterialButton(onPressed: ((){
i++;
setState((){
Map x = {'prayuta':'hyd'};
Map data1 = {'hey':x};
Map data = {'hi': data1,
'how':'hello world'};
observeMap.addAll(data);
print(observeMap);
});
}),
child: new Text('Hi'+observeMap.toString()),
),
new MaterialButton(onPressed: ((){
setState((){
observeMap['hi'].remove('hey');
print(observeMap);
});
}),
child: new Text('remove'+observeMap.toString()),
),
]
),
);
}
}
1 回答
这是按预期工作的,可观察 Map 仅识别是否添加或删除值或键,而不是在修改它所拥有的值的属性时 .