提供程序不在另一个屏幕中显示更新状态,而仅显示模态类和更改通知程序所在的第一个屏幕 [英] Provider not displaying updated state in another screen but only the first where the modal class and change Notifier is

查看:97
本文介绍了提供程序不在另一个屏幕中显示更新状态,而仅显示模态类和更改通知程序所在的第一个屏幕的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

所以我正在使用提供程序和更改通知程序,问题是当我更改状态并在同一文件中通知侦听器时,用户界面已更新,但是当我尝试从另一个屏幕中的模型访问相同数据时,它仍然保持原始或第一个版本而不是更新版本,另一个文件中的类甚至使用更改通知程序提供程序和使用方,就像其中包含模态类但不更改值的文件一样,它仅保留初始值,第二个文件仅具有changenotifierprovider和consumer,但仅显示初始文件,而不显示已更新的文件,而是具有模型类的第一个文件,并且更改通知程序功能在其小部件中显示更新的版本。

解决方案

这是我通常使用Provider的方式,从一个小部件中的数据一直共享到该小部件树中的数据,一直到该小部件树的整个其他区域中的其他一些小部件。 / p>

例如:


定义提供商扩展ChangeNotifier的屁股


  import‘package:flutter / material.dart’; 
导入 package:app / utils / AppUser.dart;

类UserProvider扩展ChangeNotifier {
///您可以在此处设置初始值,也可以使用UserProvider对象
///并调用setter为其赋予初始值应用程式中的某处,例如main.dart

AppUser _user; ///或AppUser _user = AppUser( firstName, lastName);

AppUser get user => _用户;

设置用户(AppUser newUser){
_user = newUser;

///确保您在设置中通知监听者
notifyListeners();
}

}


使用提供程序小组件包装应用像这样


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


void main(){
runApp(
MaterialApp(
initialRoute:'/ root',
route:{
'/ root':(上下文)=> MyApp(),
},
标题:您的应用程序标题,
),
);
}

类MyApp扩展了StatelessWidget {
@override
Widget build(BuildContext context){
/// Multiprovider允许您拥有多个提供程序,这对于更多
///复杂的应用程序来说非常有用,在这些应用程序中,您可能需要共享除用户
之外的其他数据。return MultiProvider(
provider:[
// /这将确保您的应用程序中有所有小部件,可以收听到提供者的更改,
////将被通知,并将共享的数据提供给他们
ChangeNotifierProvider< UserProvider> .value(value: UserProvider()),
],
子级:MaterialApp(
家庭:Wrapper(),
),
);
}
}


在应用程序中任何位置的访问和数据


  import'package:flutter / material.dart'; 
导入 package:provider / provider.dart;
///确保导入UserProvider.dart文件
import‘package:app / services / UserProvider.dart’;

类HomeScreen扩展了StatefulWidget {
@override
_HomeScreenState createState()=> _HomeScreenState();
}

类_HomeScreenState扩展了State< HomeScreen> {
UserProvider userProvider;

@override
小部件构建(BuildContext上下文){
///收听更改/提供者中的更新
userProvider = Provider.of< UserProvider>(上下文);

return脚手架(
身体:SafeArea(
小孩:中心(
小孩:文本(
///这是您如何获取更新的数据来自提供者
userProvider.user.firstName,
),
),
),
);
}
}


在应用程序中的任何位置更新数据


< pre class = lang-dart prettyprint-override> import'package:flutter / material.dart';
导入 package:provider / provider.dart;
///确保导入UserProvider.dart文件
import‘package:app / services / UserProvider.dart’;

类AnotherScreen扩展了StatefulWidget {
@override
_AnotherScreenState createState()=> _AnotherScreenState();
}

class _AnotherScreenState扩展了State< AnotherScreen> {
UserProvider userProvider;

@override
小部件构建(BuildContext上下文){
///收听更改/提供者中的更新
userProvider = Provider.of< UserProvider>(上下文);

return脚手架(
身体:SafeArea(
小孩:Center(
小孩:RaisedButton(

///这是你的方式更新提供者中的数据
onPressed:(){
userProvider.user = AppUser( new, user);
setState((){});
},
子级:Text(更新用户),
),
),
),
);
}
}

希望这有助于解决您的问题。


so im using provider and change notifier, the problem is when i change the state and notifiy listeners in the same file the user interface is updated, but when i try to access the same data from the model in another screen it still keeps the original or first version and not the updated version, the class in the other file is even using change notifier provider and a consumer just as the file with the modal class inside but is not changing the value, its only keeping the initial value, the second file only has changenotifierprovider and consumer, but it only displays the initial not the updated but the first file with the model class, and change notifier function is displaying the updated version in its widgets

解决方案

Here is how I usually use the Provider to share data from one widget all the way down in the widget tree to some other widget in a whole other region of the widget tree.

For example:

Define your provider class that extends ChangeNotifier

import 'package:flutter/material.dart';
import 'package:app/utils/AppUser.dart';

class UserProvider extends ChangeNotifier {
  /// You can either set an initial value here or use a UserProvider object 
  /// and call the setter to give it an initial value somewhere in your app, like in main.dart

  AppUser _user; /// or AppUser _user = AppUser("firstName", "lastName");

  AppUser get user => _user;

  set user(AppUser newUser) {
    _user = newUser;

    /// MAKE SURE YOU NOTIFY LISTENERS IN YOUR SETTER
    notifyListeners();
  }

}

Wrap your app with a Provider Widget like so

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


void main() {
  runApp(
    MaterialApp(
      initialRoute: '/root',
      routes: {
        '/root': (context) => MyApp(),
      },
      title: "Your App Title",
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
/// Multiprovider allows you to have more than one provider, which is great for more 
/// complex apps where you might need to share data about something else than just the user
    return MultiProvider(
      providers: [
        /// THIS WILL MAKE SURE ALL WIDGETS IN YOUR APP, THAT LISTEN TO THE PROVIDER CHANGES,
        /// WILL BE NOTIFIED AND THE SHARED DATA WILL BE PROVIDED TO THEM
        ChangeNotifierProvider<UserProvider>.value(value: UserProvider()),
      ],
      child: MaterialApp(
        home: Wrapper(),
      ),
    );
  }
}

Access and data anywhere in the app

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
/// MAKE SURE TO IMPORT THE UserProvider.dart file
import 'package:app/services/UserProvider.dart';

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  UserProvider userProvider;

  @override
  Widget build(BuildContext context) {
    /// LISTEN TO THE CHANGES / UPDATES IN THE PROVIDER
    userProvider = Provider.of<UserProvider>(context);

    return Scaffold(
      body: SafeArea(
        child: Center(
          child: Text(
            /// THIS IS HOW YOU GET THE UPDATED DATA FROM THE PROVIDER
            userProvider.user.firstName,
          ),
        ),
      ),
    );
  }
}

Update data anywhere in the app

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
/// MAKE SURE TO IMPORT THE UserProvider.dart file
import 'package:app/services/UserProvider.dart';

class AnotherScreen extends StatefulWidget {
  @override
  _AnotherScreenState createState() => _AnotherScreenState();
}

class _AnotherScreenState extends State<AnotherScreen> {
  UserProvider userProvider;

  @override
  Widget build(BuildContext context) {
    /// LISTEN TO THE CHANGES / UPDATES IN THE PROVIDER
    userProvider = Provider.of<UserProvider>(context);

    return Scaffold(
      body: SafeArea(
        child: Center(
          child: RaisedButton(

            /// THIS IS HOW YOU UPDATE THE DATA IN THE PROVIDER
            onPressed: () {
              userProvider.user = AppUser("new", "user");
              setState(() {});
            },
            child: Text("Update user"),
          ),
        ),
      ),
    );
  }
}

Hope this helps and solves your problem.

这篇关于提供程序不在另一个屏幕中显示更新状态,而仅显示模态类和更改通知程序所在的第一个屏幕的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆