我正在通过以下方式删除发动机型号:
delete(int id) {
engines.removeWhere((eng) => eng.id == id);
notifyListeners();
}
}
这里有趣的部分是,在调试时,带有传递的id的引擎确实被正确地删除了。
但视觉上看到错误的eengine小部件被删除,我不知道为什么?
我在这里把所有的代码,可以很容易地复制/粘贴到著名的main.dart文件!
我是新的扑,甚至更多的供应商包。
也许我做错了什么...
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Provider nested model demo',
theme: ThemeData(
// This is the theme of your application.
primarySwatch: Colors.blue,
),
home: ApplicationPage());
}
}
class ApplicationPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
// setup test data which could come from a http service
var engines = new List<EngineEntity>();
var engine1 = new EngineEntity(1, "Engine 1");
var engine2 = new EngineEntity(2, "Engine 2");
var engine3 = new EngineEntity(3, "Engine 3");
var engine4 = new EngineEntity(4, "Engine 4");
var engine5 = new EngineEntity(5, "Engine 5");
engines.add(engine1);
engines.add(engine2);
engines.add(engine3);
engines.add(engine4);
engines.add(engine5);
var newMachineEntity = new MachineEntity(1, "Power x1000", engines);
return Scaffold(
appBar: AppBar(title: Text("Machine demo"), elevation: 6),
body: ChangeNotifierProvider(create: (context) => new MachineModel(newMachineEntity), child: MachineWidget()));
}
}
class MachineModel extends ChangeNotifier {
MachineEntity machineEntity;
List<EngineModel> engines;
MachineModel(this.machineEntity) {
engines = this.machineEntity.engines.map((eng) => new EngineModel(eng)).toList();
}
String get name => machineEntity.name;
set name(String value) {
machineEntity.name = value;
notifyListeners();
}
delete(int id) {
engines.removeWhere((eng) => eng.id == id);
notifyListeners();
}
}
class EngineModel extends ChangeNotifier {
EngineEntity engine;
EngineModel(this.engine);
String get name => engine.name;
set name(String value) {
name = value;
notifyListeners();
}
int get id => engine.id;
}
class MachineEntity {
int id;
String name;
List<EngineEntity> engines;
MachineEntity(this.id, this.name, this.engines);
}
class EngineEntity {
int id;
String name;
EngineEntity(this.id, this.name);
}
class EngineListWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
final appState = Provider.of<MachineModel>(context);
return Container(
child: ListView(
shrinkWrap: true,
children: appState.engines.map((eng) => EngineWidget(eng)).toList(),
),
);
}
}
// Rendered with the EngineModel as data basis
class EngineWidget extends StatelessWidget {
EngineWidget(this.engineModel);
final EngineModel engineModel;
@override
Widget build(BuildContext context) {
final appState = Provider.of<MachineModel>(context);
return Container(
child: Row(
children: <Widget>[
Expanded(flex: 2, child: Text(engineModel.id.toString())),
Expanded(
flex: 5,
child: TextFormField(
initialValue: engineModel.name,
)),
Expanded(
flex: 3,
child: FlatButton(onPressed: () => appState.delete(engineModel.id), child: Text("Delete")),
)
],
),
);
}
}
// Rendered with the MachineModel as data basis
class MachineWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Consumer<MachineModel>(builder: (context, machine, child) {
return Container(
child: Column(
children: <Widget>[
Container(
padding: new EdgeInsets.all(5),
child: TextFormField(
initialValue: machine.name,
onChanged: (value) => machine.name = value,
)),
EngineListWidget(),
],
),
);
});
}
}
溶液:
children: appState.engines.map((eng) => EngineWidget(ValueKey(eng.id), eng)).toList(),
class EngineWidget extends StatelessWidget {
EngineWidget(this.key, this.engineModel) : super(key: key);
final Key key;
}
The widget needs a unique key which is provided by ValueKey and of course my unique database id ;-)
1条答案
按热度按时间kh212irz1#
你需要为添加到列表中的小部件分配一个键来获得一个标识符。这里发生的事情是
List.removeWhere()
正确地从列表中删除了这个值,但是由于它会在notifyListeners()
时被加载到一个新的列表中,所以不能保证它们会被放置在哪个列表项中。