将动态数据传递到 Flutter 中的多个页面
Pass dynamic data into multiply pages in Flutter
我使用 json 从我的数据库中获取数据,现在我想在列表视图中使用该动态数据,无论何时单击其中任何一个,它都会将您导航到另一个页面,再次使用之前获取的动态数据。
这是我的 json:
的数据模型
class Base{
//the type of our object is the array
List <Device> array;
List<Device> devices;
Base( {this.devices});
factory Base.fromJson(Map<String,dynamic> parsedJson){
var list = parsedJson['devices'] as List;
List<Device> deviceList = list.map((i) => Device.fromJson(i)).toList();
return Base(
devices: deviceList
);
}
}
class Device {
String device_desc,device_title,image_path;
int status_id;
List<function> functions;
Status statuss ;
Device({this.device_desc,this.device_title,this.image_path,this.status_id,this.functions,this.statuss});
factory Device.fromJson(Map<String,dynamic>parsedJson){
//var functionFromJson=parsedJson["function"];
//List<function> functionList=functionFromJson.cast<function>();
var list = parsedJson['functions'] as List;
List<function> functionList=list.map((i)=>function.fromJson(i)).toList();
return Device(
device_desc: parsedJson["device_desc"],
device_title: parsedJson["device_title"],
image_path: parsedJson["image_path"],
status_id: parsedJson["status_id"],
functions: functionList,
statuss: Status.fromJson(parsedJson['statuss'])
);
}
}
class Status {
String status_desc, status_title;
Status({this.status_desc,this.status_title});
factory Status.fromJson(Map<String,dynamic>parsedJson){
return Status(
status_desc: parsedJson["status_desc"],
status_title: parsedJson["status_title"],
);
}
}
class function {
String function_desc, function_title;
int device_id, status;
function ({this.function_desc,this.function_title,this.device_id,this.status});
factory function.fromJson(Map<String,dynamic> parsedJson){
return function(
function_desc: parsedJson["function_desc"],
function_title:parsedJson["function_title"],
device_id: parsedJson["device_id"],
status: parsedJson["status"]
);
}
}
现在我以这种方式将数据导航到第二页:
(这个导航器是一个listview.builder,所以,我们可以使用索引)
onPressed: () { Navigator.push(context,MaterialPageRoute(builder: (context)=> MyHomePage2(snapshot.data.devices[index]))); },
我定义了一个变量,它的类型是设备,我使用构造函数来指定不同的动态数据:
Class MyHomePage2 extends StatefulWidget {
final Device devices2;
MyHomePage2(this.devices2);
@override
_MyHomePage2State createState() => new _MyHomePage2State();
}
但是每当我想使用名为 devices2 的变量时,例如下面的代码:
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text('خانه هوشمند'),
),
body: ListView(
//the main list containing stack , device image,device name
children: <Widget>[
new Container(
//for appropriate image size I use container
padding: EdgeInsets.all(50.0),
child: ListView(
//contains devicename and image
physics: new NeverScrollableScrollPhysics(),
shrinkWrap: true,
children: <Widget>[
ListView(
physics: new NeverScrollableScrollPhysics(),
shrinkWrap: true,
children: <Widget>[
new Image.asset('images/acc.png',fit: BoxFit.fitWidth,),
new Text('نام دستگاه',textAlign: TextAlign.right,style: TextStyle(fontSize: 25.0,color: Colors.teal),),
new Text(devices2[0].device_title,textAlign: TextAlign.right,style: TextStyle(fontSize: 20.0,color: Colors.blueGrey),),
],
),
],
),
),
会报错
[dart] 未定义名称 'devices2'.
感谢任何帮助:)
在您的代码中:
new Text(devices2[0].device_title,textAlign: TextAlign.right,style: TextStyle(fontSize: 20.0,color: Colors.blueGrey),),
更改为:
new Text(widget.devices2[0].device_title,textAlign: TextAlign.right,style: TextStyle(fontSize: 20.0,color: Colors.blueGrey),),
我使用 json 从我的数据库中获取数据,现在我想在列表视图中使用该动态数据,无论何时单击其中任何一个,它都会将您导航到另一个页面,再次使用之前获取的动态数据。 这是我的 json:
的数据模型 class Base{
//the type of our object is the array
List <Device> array;
List<Device> devices;
Base( {this.devices});
factory Base.fromJson(Map<String,dynamic> parsedJson){
var list = parsedJson['devices'] as List;
List<Device> deviceList = list.map((i) => Device.fromJson(i)).toList();
return Base(
devices: deviceList
);
}
}
class Device {
String device_desc,device_title,image_path;
int status_id;
List<function> functions;
Status statuss ;
Device({this.device_desc,this.device_title,this.image_path,this.status_id,this.functions,this.statuss});
factory Device.fromJson(Map<String,dynamic>parsedJson){
//var functionFromJson=parsedJson["function"];
//List<function> functionList=functionFromJson.cast<function>();
var list = parsedJson['functions'] as List;
List<function> functionList=list.map((i)=>function.fromJson(i)).toList();
return Device(
device_desc: parsedJson["device_desc"],
device_title: parsedJson["device_title"],
image_path: parsedJson["image_path"],
status_id: parsedJson["status_id"],
functions: functionList,
statuss: Status.fromJson(parsedJson['statuss'])
);
}
}
class Status {
String status_desc, status_title;
Status({this.status_desc,this.status_title});
factory Status.fromJson(Map<String,dynamic>parsedJson){
return Status(
status_desc: parsedJson["status_desc"],
status_title: parsedJson["status_title"],
);
}
}
class function {
String function_desc, function_title;
int device_id, status;
function ({this.function_desc,this.function_title,this.device_id,this.status});
factory function.fromJson(Map<String,dynamic> parsedJson){
return function(
function_desc: parsedJson["function_desc"],
function_title:parsedJson["function_title"],
device_id: parsedJson["device_id"],
status: parsedJson["status"]
);
}
}
现在我以这种方式将数据导航到第二页: (这个导航器是一个listview.builder,所以,我们可以使用索引)
onPressed: () { Navigator.push(context,MaterialPageRoute(builder: (context)=> MyHomePage2(snapshot.data.devices[index]))); },
我定义了一个变量,它的类型是设备,我使用构造函数来指定不同的动态数据:
Class MyHomePage2 extends StatefulWidget {
final Device devices2;
MyHomePage2(this.devices2);
@override
_MyHomePage2State createState() => new _MyHomePage2State();
}
但是每当我想使用名为 devices2 的变量时,例如下面的代码:
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text('خانه هوشمند'),
),
body: ListView(
//the main list containing stack , device image,device name
children: <Widget>[
new Container(
//for appropriate image size I use container
padding: EdgeInsets.all(50.0),
child: ListView(
//contains devicename and image
physics: new NeverScrollableScrollPhysics(),
shrinkWrap: true,
children: <Widget>[
ListView(
physics: new NeverScrollableScrollPhysics(),
shrinkWrap: true,
children: <Widget>[
new Image.asset('images/acc.png',fit: BoxFit.fitWidth,),
new Text('نام دستگاه',textAlign: TextAlign.right,style: TextStyle(fontSize: 25.0,color: Colors.teal),),
new Text(devices2[0].device_title,textAlign: TextAlign.right,style: TextStyle(fontSize: 20.0,color: Colors.blueGrey),),
],
),
],
),
),
会报错
[dart] 未定义名称 'devices2'.
感谢任何帮助:)
在您的代码中:
new Text(devices2[0].device_title,textAlign: TextAlign.right,style: TextStyle(fontSize: 20.0,color: Colors.blueGrey),),
更改为:
new Text(widget.devices2[0].device_title,textAlign: TextAlign.right,style: TextStyle(fontSize: 20.0,color: Colors.blueGrey),),