我如何在 flutter 中将数据从一个小部件传递到另一个小部件?
How i can pass Data from one widget to another widget in flutter?
我想将数据从一个小部件传递到另一个小部件。
我正在从 firebase 获取数据,我希望将这些数据传递给小部件。
如何将数据从一个屏幕传递到另一个屏幕。
这就是我的代码的样子。
class Home extends StatefulWidget {
@override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
int _currentindex = 0;
final List<Widget> _children = [
Dashboard(),
Search(),
];
void onTappedBar(int index) {
setState(() {
_currentindex = index;
});
}
@override
Widget build(BuildContext context) {
final user = Provider.of<User>(context);
return StreamBuilder<UserData>(
stream: DatabaseService(uid: user.uid).userData,
builder: (context, snapshot) {
if (snapshot.hasData) {
UserData userData = snapshot.data;
return return Scaffold(
backgroundColor: Color(0xFFf6f5fb),
body: _children[_currentindex],
bottomNavigationBar: CurvedNavigationBar(
onTap: onTappedBar,
index: _currentindex,
items: <Widget>[
Icon(
Icons.home,
),
Icon(
Icons.search,
],
),
);
});
}
}
从这个小部件中,数据从 firebase 加载。现在我想将 snapshot.data 传递给 Dashboard()
小部件和 Search()
小部件。
我想显示用户名 Dashboard()。
这就是我的 ```Dashboard()`` Widget for exmaple
class Dashboard extends StatefulWidget {
@override
_DashboardState createState() => _DashboardState();
}
class _DashboardState extends State<Dashboard> {
@override
Widget build(BuildContext context) {
return Center(
child: Text('Here i want display the data')
),
);
}
}
这是模型class:
class User {
final String uid;
User({this.uid});
}
class UserData {
final String uid;
final String username;
final String phonenumber;
UserData({ this.uid, this.username, this.phonenumber });
}
如果是像您这样的简单场景,则通过构造函数传递它:
class Dashboard extends StatefulWidget {
final UserData userData;
// userData is not optional-named parameter
const Dashboard(this.userData, {Key key}) : super(key: key);
@override
_DashboardState createState() => _DashboardState();
}
class _DashboardState extends State<Dashboard> {
@override
Widget build(BuildContext context) {
final UserData userData = widget.userData;//do something with user
return Center(
child: Text('user is ${user.username}')
),
);
}
}
和 HomeState
(不要将小部件保存为 class 的字段,即时创建它们):
class _HomeState extends State<Home> {
int _currentindex = 0;
void onTappedBar(int index) {
setState(() {
_currentindex = index;
});
}
@override
Widget build(BuildContext context) {
final user = Provider.of<User>(context);
return StreamBuilder<UserData>(
stream: DatabaseService(uid: user.uid).userData,
builder: (context, snapshot) {
if (snapshot.hasData) {
UserData userData = snapshot.data;
return Scaffold(
backgroundColor: Color(0xFFf6f5fb),
body: Column(
children: [
Dashboard(userData),
Search(userData),
],
),
bottomNavigationBar: CurvedNavigationBar(
onTap: onTappedBar,
index: _currentindex,
items: <Widget>[
Icon(
Icons.home,
),
Icon(
Icons.search,
],
),
);
});
}
}
我想将数据从一个小部件传递到另一个小部件。 我正在从 firebase 获取数据,我希望将这些数据传递给小部件。 如何将数据从一个屏幕传递到另一个屏幕。 这就是我的代码的样子。
class Home extends StatefulWidget {
@override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
int _currentindex = 0;
final List<Widget> _children = [
Dashboard(),
Search(),
];
void onTappedBar(int index) {
setState(() {
_currentindex = index;
});
}
@override
Widget build(BuildContext context) {
final user = Provider.of<User>(context);
return StreamBuilder<UserData>(
stream: DatabaseService(uid: user.uid).userData,
builder: (context, snapshot) {
if (snapshot.hasData) {
UserData userData = snapshot.data;
return return Scaffold(
backgroundColor: Color(0xFFf6f5fb),
body: _children[_currentindex],
bottomNavigationBar: CurvedNavigationBar(
onTap: onTappedBar,
index: _currentindex,
items: <Widget>[
Icon(
Icons.home,
),
Icon(
Icons.search,
],
),
);
});
}
}
从这个小部件中,数据从 firebase 加载。现在我想将 snapshot.data 传递给 Dashboard()
小部件和 Search()
小部件。
我想显示用户名 Dashboard()。 这就是我的 ```Dashboard()`` Widget for exmaple
class Dashboard extends StatefulWidget {
@override
_DashboardState createState() => _DashboardState();
}
class _DashboardState extends State<Dashboard> {
@override
Widget build(BuildContext context) {
return Center(
child: Text('Here i want display the data')
),
);
}
}
这是模型class:
class User {
final String uid;
User({this.uid});
}
class UserData {
final String uid;
final String username;
final String phonenumber;
UserData({ this.uid, this.username, this.phonenumber });
}
如果是像您这样的简单场景,则通过构造函数传递它:
class Dashboard extends StatefulWidget {
final UserData userData;
// userData is not optional-named parameter
const Dashboard(this.userData, {Key key}) : super(key: key);
@override
_DashboardState createState() => _DashboardState();
}
class _DashboardState extends State<Dashboard> {
@override
Widget build(BuildContext context) {
final UserData userData = widget.userData;//do something with user
return Center(
child: Text('user is ${user.username}')
),
);
}
}
和 HomeState
(不要将小部件保存为 class 的字段,即时创建它们):
class _HomeState extends State<Home> {
int _currentindex = 0;
void onTappedBar(int index) {
setState(() {
_currentindex = index;
});
}
@override
Widget build(BuildContext context) {
final user = Provider.of<User>(context);
return StreamBuilder<UserData>(
stream: DatabaseService(uid: user.uid).userData,
builder: (context, snapshot) {
if (snapshot.hasData) {
UserData userData = snapshot.data;
return Scaffold(
backgroundColor: Color(0xFFf6f5fb),
body: Column(
children: [
Dashboard(userData),
Search(userData),
],
),
bottomNavigationBar: CurvedNavigationBar(
onTap: onTappedBar,
index: _currentindex,
items: <Widget>[
Icon(
Icons.home,
),
Icon(
Icons.search,
],
),
);
});
}
}