Mobx.dart: No observables detected in the build method of observerEmail

Created on 15 Apr 2021  Â·  7Comments  Â·  Source: mobxjs/mobx.dart

Restarted application in 1.326ms.
I/flutter (13489): #3 SignInPageState._buildEmailTF package:flutter_auth/…/sign_in/sign_in_page.dart:36
I/flutter (13489): No observables detected in the build method of observerEmail
I/flutter (13489): -- SignInModule INITIALIZED
I/flutter (13489): -- AppModule INITIALIZED

File SignInStore.dart

import 'package:mobx/mobx.dart';

part 'sign_in_store.g.dart';

class SignInStore = _SignInStoreBase with _$SignInStore;

abstract class _SignInStoreBase with Store {
@observable
String email = "";

@action
changeEmail(String value) => email = value;

@observable
String password = "";

@action
changePassword(String value) => password = value;
}

My widget in sign_in_page.dart:

Widget _buildEmailTF() {
//return Observer(
// name: 'observerEmail',
// builder: (_) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
//Text(
// "Email",
// style: kLabelStyle,
//),
SizedBox(
height: 5,
),
Container(
alignment: Alignment.centerLeft,
decoration: kBoxDecorationStyle,
height: 45,
child: Observer(
name: 'observerEmail',
builder: (_) {

return TextFormField(
autofocus: true,
onChanged: controller.changeEmail,
keyboardType: TextInputType.emailAddress,
style: TextStyle(color: Colors.white),
decoration: InputDecoration(
labelText: 'E-mail',
labelStyle: kLabelStyle,
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.transparent,
),
borderRadius: BorderRadius.circular(10.0),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.white,
),
borderRadius: BorderRadius.circular(10.0),
),
contentPadding: EdgeInsets.only(
top: 14,
),
prefixIcon: Icon(
Icons.email,
color: Colors.white,
),
//hintText: "Entre com seu e-mail",
//hintStyle: kHintTextStyle,
),
);
},
),
)
],
);
//},
//);
}

my project
https://github.com/edukmattos/flutter_auth

All 7 comments

Is there anybody here ?

It is showing so because you have not used any observable inside the Observer builder .

@pr-1 Hi !
Sorry, I dont understanding !

Could you suggest to me what the code should look like?

In your signin store you have an observable email , But you are not using its value in the UI inside the Observer Widget builder function.
A point to be noted - Observer widget is used when you want to rebuild the ui whenever some observable changes its value. So you have to use that observable inside Observer Widget .
For calling actions you don't need Observer Widget.

child: Observer(
name: 'observerEmail',
builder: (_) {
   return  Text('${signinStore.email}');
   },
),

Here I am using the observable email inside my builder method . So if any action will change the value of email , this Observer widget will refresh the UI.

@pr-1 Sorry again !

Tks for ur help but type of my field is not Text but TextFormField (data entry).
I need (I think) to link this Email field to the changeEmail action as it is in the SignInStore.
As far as I know, I should in the onChange controller indicate the action changeEmail (I used it in an application in flutter 1.17 onChange: controller.changeEmail).

Observer(
name: 'observerEmail',
builder: (_) {
return TextFormField(
autofocus: true,
onChanged: controller.changeEmail,
keyboardType: TextInputType.emailAddress,
style: TextStyle(color: Colors.white),
decoration: InputDecoration(
labelText: 'E-mail',
labelStyle: kLabelStyle,
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.transparent,
),

I tried onChanged: signInStore.changeEmail and didnt worked.

I don't know if I made myself understood

@pr-1
Hi again !

I read better urs instructions and I noticed that isnt necessary the Widget Obserser for call actions inside of Stores.

Its worked it now.

Tysm

Please close the issue now if it's clear ?

Was this page helpful?
0 / 5 - 0 ratings