如何将 flutter textediting 控制器值从一个无状态小部件传递到另一个无状态小部件

问题描述

这里是 main.dart 文件

import 'package:Flutter/material.dart';
import 'package:untitled/button.dart';
import 'package:untitled/form.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',theme: ThemeData(
        primarySwatch: Colors.blue,),home: MyHomePage(title: 'Flutter Demo Home Page'),);
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key? key,required this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[MyForm(),MyButton()],);
  }
}

这里是 form.dart 文件

import 'package:Flutter/material.dart';

class MyForm extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    TextEditingController x = TextEditingController();
    return Container(
      child: Center(
        child: TextField(
          controller: x,decoration: Inputdecoration(labelText: "Name"),);
  }
}

这是 button.dart 文件

import 'package:Flutter/material.dart';

class MyButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
        child: ElevatedButton(
          onpressed: () {
            //if I press this button the textediting field will show 10
          },child: Text("Pass 10"),);
  }
}
  1. 如果我按下 button.dart 中的按钮,如何在文本编辑字段中显示数据?
  2. 做这些事情的最佳方式是什么?
  3. 我应该在 statelesswidget 中使用 statefulwidgets 还是在 statefulwidgets 中使用 statelesswidgets?

我的想法是用redux或者provider来传递这种东西。虽然我不知道这个简单的东西是否需要状态管理系统。

解决方法

您需要提升状态(在主控制器中创建您的控制器并将其传递给孩子)

// main.dart
class _MyHomePageState extends State<MyHomePage> {
  TextEditingController x = TextEditingController();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[MyForm(x),MyButton(x)],),);
  }
}

class MyForm extends StatelessWidget {
  MyForm(this.x);
  final TextEditingController x;
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
        child: TextField(
          controller: x,decoration: InputDecoration(labelText: "Name"),);
  }
}

class MyButton extends StatelessWidget {
  MyButton(this.x);
  final TextEditingController x;
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
        child: ElevatedButton(
          onPressed: () {
            x...
            //if I press this button the textediting field will show 10
          },child: Text("Pass 10"),);
  }
}