在Flutter中,可以通过回调函数将输入值从扩展子小部件返回到父小部件。
以下是一个简单的示例,演示了如何将输入值从子小部件返回到父小部件:
父小部件:
class ParentWidget extends StatefulWidget {
@override
_ParentWidgetState createState() => _ParentWidgetState();
}
class _ParentWidgetState extends State<ParentWidget> {
String inputValue = '';
void updateInputValue(String value) {
setState(() {
inputValue = value;
});
}
@override
Widget build(BuildContext context) {
return Column(
children: [
ChildWidget(callback: updateInputValue),
Text('输入值:$inputValue'),
],
);
}
}
子小部件:
class ChildWidget extends StatefulWidget {
final ValueChanged<String> callback;
const ChildWidget({required this.callback});
@override
_ChildWidgetState createState() => _ChildWidgetState();
}
class _ChildWidgetState extends State<ChildWidget> {
final TextEditingController _controller = TextEditingController();
@override
Widget build(BuildContext context) {
return Column(
children: [
TextField(controller: _controller),
ElevatedButton(
onPressed: () {
widget.callback(_controller.text);
},
child: Text('返回'),
),
],
);
}
}
在上面的示例中,父小部件ParentWidget
包含一个inputValue
变量用于存储子小部件返回的输入值。父小部件通过updateInputValue
回调函数来更新inputValue
的值。子小部件ChildWidget
包含一个TextField
用于输入值,并通过ElevatedButton
按钮将输入值传递给父小部件。
通过以上的代码,输入值将从子小部件传递到父小部件,并在父小部件中进行展示。
腾讯云相关产品和产品介绍链接地址:
领取专属 10元无门槛券
手把手带您无忧上云