Provider does not update Text widget

Question

I have a problem with updating text widget in Level3 class after input some text in textField widget. Appreciate your help

Expose data in below code:

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // home: TasksScreen(),
      home: ChangeNotifierProvider<Data>(
        create: (context) => Data(),
        child: Scaffold(
          appBar: AppBar(
            title: Container(
              child: MyText(),
            ),
          ),
          body: Level1(),
        ),
      ),
    );
  }
}

create Data class for model data in below class

class Data extends ChangeNotifier {
  String data = 'this data';

  void changeString(String newString) {
    data = newString;
    print(newString);//don't print anything after typing in textFild
    print(data);//don't print either
    notifyListeners();
  }
}

I want to use Data object properties in MyTextField in below code but it seems do not trigger Provider.of<Data>(context).changeString(newValue)

class MyTextField extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return TextField(
      onChanged: (newValue) {
        print(newValue);//print newValue correctly
        Provider.of<Data>(context).changeString(newValue);
      },
    );
  }
}

class Level3 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
        child: Text(
          //this part don't update as typing in textField
          Provider.of<Data>(context).data,
          //will return an instance of Provider
          //type found in the context that is sent as a parameter
        ),
      ),
    );
  }
}

Answer 1

You can copy paste run full code below
In onChanged, You can use listen: false
code snippet

return TextField(
      onChanged: (newValue) {
        print(newValue); //print newValue correctly
        Provider.of<Data>(context, listen: false).changeString(newValue);
      },
    );

working demo

full code

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class Data extends ChangeNotifier {
  String data = 'this data';

  void changeString(String newString) {
    data = newString;
    print(newString); //don't print anything after typing in textFild
    print(data); //don't print either
    notifyListeners();
  }
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // home: TasksScreen(),
      home: ChangeNotifierProvider<Data>(
        create: (context) => Data(),
        child: Scaffold(
          appBar: AppBar(
            title: Container(
              child: MyTextField(),
            ),
          ),
          body: Level3(),
        ),
      ),
    );
  }
}

class MyTextField extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return TextField(
      onChanged: (newValue) {
        print(newValue); //print newValue correctly
        Provider.of<Data>(context, listen: false).changeString(newValue);
      },
    );
  }
}

class Level3 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
        child: Text(
          //this part don't update as typing in textField
          Provider.of<Data>(context).data,
          //will return an instance of Provider
          //type found in the context that is sent as a parameter
        ),
      ),
    );
  }
}

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

Answer 2

You can try this

(context.watch<Data>().data).toString();