Pasar datos a StatefulWidget y acceder a ellos en su estado en Flutter


124

Tengo 2 pantallas en mi aplicación Flutter: lista de registros y pantalla para crear y editar registros.

Si paso el objeto a la segunda pantalla, significa que voy a editar esto y si paso nulo, significa que estoy creando un nuevo elemento. La pantalla de edición es un widget con estado y no estoy seguro de cómo usar este enfoque https://flutter.io/cookbook/navigation/passing-data/ para mi caso.

class RecordPage extends StatefulWidget {
  final Record recordObject;

  RecordPage({Key key, @required this.recordObject}) : super(key: key);

  @override
  _RecordPageState createState() => new _RecordPageState();
}

class _RecordPageState extends State<RecordPage> {
  @override
  Widget build(BuildContext context) {
   //.....
  }
}

¿Cómo puedo acceder a recordObject dentro de _RecordPageState ?



¿Cómo podemos usar el valor de la variable 'recordObject' en una función de la clase _RecordPageState?
— Kamlesh

Respuestas:


208

Para usar recordObject en _RecordPageState, solo tiene que escribir widget.objectname como se muestra a continuación

class _RecordPageState extends State<RecordPage> {
  @override
  Widget build(BuildContext context) {
   .....
   widget.recordObject
   .....
  }
}

9
Aquellos que son nuevos en Flutter, no olviden definir un widget como '@override RecordPage get widget => super.widget;'
— hhk

22
@hhk ¿Por qué es necesario?
— Herohtar

2
¿No debería recordObjectser parte de la Stateclase? Lógicamente, tenerlo dentro StatefulWidgetes incorrecto (en términos de cohesión). Además, todos los campos de StatefulWidgetdeben ser inmutables. ¿Qué pasa si desea cambiar la recordObjectreferencia?
— Alex Semeniuk

Tengo exactamente lo mismo y no funciona haciendo algo como Text(widget.recordObject), dice que mi var es nula
— Dani

¿Cómo podemos usar el valor de la variable 'recordObject' en una función de la clase _RecordPageState?
— Kamlesh

32
class RecordPage extends StatefulWidget {
  final Record recordObject;

  RecordPage({Key key, @required this.recordObject}) : super(key: key);

  @override
  _RecordPageState createState() => new _RecordPageState(recordObject);
}

class _RecordPageState extends State<RecordPage> {
  Record  recordObject
 _RecordPageState(this. recordObject);  //constructor
  @override
  Widget build(BuildContext context) {.    //closure has access
   //.....
  }
}

1
Explique por qué este es un widget con estado.
— localhoost

@atilkan debido a que el script inicial de OP es un StatefulWidget, simplemente agregó algunas líneas para satisfacer las necesidades.
— adadion

3
No creo que el tener recordObjectcampo tanto en Statey StatefulWidgetclases es tal idea de una buena (aunque vi tutoriales haciendo exactamente esto). El enfoque de acceder a los campos StatefulWidgetmediante el uso de un widgetcampo de Stateclase parece un enfoque más correcto (a pesar de que tiene sus propios problemas)
— Alex Semeniuk

21

Ejemplo completo

No es necesario pasar parámetros a State usando su constructor. Puede acceder fácilmente a estos utilizando widget.myField .

class MyRecord extends StatefulWidget {
  final String recordName;
  const MyRecord(this.recordName);

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

class MyRecordState extends State<MyRecord> {
  @override
  Widget build(BuildContext context) {
    return Text(widget.recordName); // Here you direct access using widget
  }
}

Pasa tus datos cuando navegas por la pantalla:

 Navigator.of(context).push(MaterialPageRoute(builder: (context) => MyRecord("WonderWorld")));
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.