如何在颤振中重用有状态的小部件答案

【问题标题】：How to reuse a stateful widget in flutter如何在颤振中重用有状态的小部件
【发布时间】：2020-04-20 21:42:04
【问题描述】：

我有一个以下状态完整小部件。我需要通过更改两个变量id 和collectionName 来重用它。通常我会提取一个小部件，但在这种情况下，我正在修改变量 firstName，它不会让我提取小部件。

class IndividualSignupPage1 extends StatefulWidget {
  static final id = 'idIndividualSignupPage1';
  final collectionName = 'Individual';

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

class _IndividualSignupPage1State extends State<IndividualSignupPage1> {
  String firstName;
  DateTime birthDate;
  final firestoreObj = Firestore.instance;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: GeneralAppBar(
        appBar: AppBar(),
      ),
      body: Container(
        child: Column(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: <Widget>[
          TextField(
            onChanged: (value) {
              this.firstName = value;
            },
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.end,
            children: <Widget>[
              Expanded(
                child: Card(
                  child: ListTile(
                    title: Text(
                      this.birthDate == null
                          ? 'Birthdate'
                          : '${this.birthDate.year}-${this.birthDate.month}-${this.birthDate.day}',
                    ),
                    onTap: () {
                      DatePicker.showDatePicker(
                        context,
                        initialDateTime: this.birthDate,
                        onConfirm: (newDate, listOfIndexes) {
                          setState(() {
                            this.birthDate = newDate;
                          });
                        },
                      );
                    },
                  ),
                ),
              ),
            ],
          ),
          WFullWidthButton(
            name: 'Save',
            onPressedFunc: () async {
              // save all info to firestore db
              firestoreObj.collection(widget.collectionName).document('xyz').setData({
                'firstName': this.firstName,
                'birthDate': this.birthDate,
              }, merge: true);
            },
          ),
        ]),
      ),
    );
  }
}

谢谢

【问题讨论】：

标签： flutter statefulwidget

【解决方案1】：

您可以将参数传递给类 IndividualSignupPage1，然后在其对应的状态类 _IndividualSignupPage1State 中使用属性“widget”。喜欢，

// pass the arguments from another class.
class IndividualSignupPage1 extends StatefulWidget {
  final String id;
  final String collectionName;

  IndividualSignupPage1(this.id,this.collectionName);

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

假设您想在其对应的状态类_IndividualSignupPage1State 中使用 id 和 collectionName，您可以使用 "widget" 属性访问它，例如，

appBar: AppBar(title: Text(widget.id)), 
 **OR**
appBar: AppBar(title: Text(widget.collectionName)),

注意：您只能在函数/方法中访问 widget 属性。

【讨论】：

【解决方案2】：

创建 IndividualSignupPage1 构造函数并使用构造函数参数传递数据。

class IndividualSignupPage1 extends StatefulWidget {
  final String id;
  final String collectionName;

  IndividualSignupPage1(this.id,this.collectionName);

【讨论】：