如何在riverpod狀態管理中使用讀取方法

我使用 Riverpod 狀態管理

pubspec.yaml：

dependencies:
  flutter:
    sdk: flutter
  provider: ^6.0.1
  get: ^4.6.1
  flutter_bloc: ^8.0.1
  riverpod: ^1.0.3
  hooks_riverpod: ^1.0.3

我的提供者檔案

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

class CounterRiv extends StateNotifier<int> {
  CounterRiv() : super(0);

  void increament() => state  ;
}

這是主要的

import 'package:flutter/material.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:statemng/riverpod/controler_riv.dart';
import 'package:statemng/riverpod/home_riv.dart';


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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(),
      
      home: ProviderScope(
        child: MyHomeRiv(),
      ),
    );
  }
}

檔案首頁

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

import 'package:flutter_riverpod/flutter_riverpod.dart';

import 'package:statemng/riverpod/controler_riv.dart';

import 'dashboard_riv.dart';

class MyHomeRiv extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

final counterprovider =
    StateNotifierProvider<CounterRiv, int>((ref) => CounterRiv());

class _MyHomePageState extends State<MyHomeRiv> {
  @override
  int n = 0;

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("state management"),
      ),
      body: Center(
          child: Column(
        children: [
          Dashboard(),
        ],
      )),
      floatingActionButton:  FloatingActionButton(
            child: Icon(Icons.add),
            onPressed: () {
              print("n= ${n  }");

              setState(() {
                context.read(counterprovider.notifier).increament();
              });
            }),
      
    );
  }
}

在 setState 中，我有errorread 方法：未為型別“BuildContext”定義方法“read”。嘗試將名稱更正為現有方法的名稱，或定義名為“read”的方法

在計數器檔案中

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

import 'package:statemng/riverpod/home_riv.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
class Conter2 extends HookWidget {
  @override
  Widget build(BuildContext context) {
    final count = useProvider(counterprovider);
    return Card(
      elevation: 6,
      child: Container(
        height: 150,
        width: 150,
        child: Center(
          child: Text(count .toString(), style: const TextStyle(fontSize: 60)),
        ),
      ),
    );
  }
}

我有Error在useProvider：

沒有為型別“Conter2”定義方法“useProvider”。嘗試將名稱更正為現有方法的名稱，或定義名為“useProvider”的方法

有誰知道這個2Error的解決方案是什么？

uj5u.com熱心網友回復：

您應該添加 'flutter_riverpod' 包，因為您正在使用 flutter。如果您打算使用鉤子，請添加“hooks_riverpod”。

檢查此表：https : //riverpod.dev/docs/getting_started#installing-the-package

在 main.dart 中，使用 ProviderScope 包裝 MaterialApp。

void main() {
  runApp(ProviderScope(child: MyApp()));
}

讀一個StateProvider的方法有很多種，簡單提一下：

• 使用 ConsumerWidget（用于 StatelessWidgets）

class MyHomeRiv extends ConsumerWidget { 
  const HomeView({Key? key}): super(key: key);

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return Scaffold(
      appBar: AppBar(
        title: Text("state management"),
      ),
      body: Center(
          child: Column(
          children: [
           Dashboard(),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
          child: Icon(Icons.add),
          onPressed: () {
             ref.read(counterprovider.notifier).increament();
          },
       ),
    );
  }
}

• 使用 HookConsumerWidget

class Conter2 extends HookConsumerWidget {
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final count = ref.watch(counterprovider);
    return Card(
      elevation: 6,
      child: Container(
        height: 150,
        width: 150,
        child: Center(
          child: Text(count.toString()),
        ),
      ),
    );
  }
}

我強烈建議您閱讀檔案并查看所有提供的示例：https : //riverpod.dev/docs/concepts/reading

標籤：扑 镖 河荚

上一篇：不能將引數型別“Function”分配給引數型別“voidFunction(bool?)

下一篇：如何在textformfield中要求字串具有大寫、小寫和數字并驗證它？