如何在flutter中使用listview和riverpod

我正在開發一個帶有flutter和flutter_riverpod的應用程式。我想將 listview 與 Riverpod 一起使用。但是我不知道怎么用。我有一個文本欄位的 onSubmitted 方法。這種方法可以為 texffield 文本作業一些 dart 代碼。我的目的是將單詞保存到listview。我為此目的使用了flutter_riverpod，但我不知道如何為 stateprovider 或任何其他提供者使用串列。

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


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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: SafeArea(
          child: SingleChildScrollView(child: ana1()),
        ),
      ),
    );
  }
}

final List<String> myList= [];
final StateProvider<int> _lengthProvider = StateProvider((ref) => 0);

class ana1 extends ConsumerWidget {
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return Container(
        width: 1000,
        height: 1000,
        color: Colors.yellow,
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Container(
                width: 500,
                child: TextField(
                  decoration: InputDecoration(
                    border: OutlineInputBorder(),
                    labelText: 'Content Text',
                  ),
                  onSubmitted: (inText) {
                    print(inText);

                    String gir = inText;
                            String myText = "$gir a";
                            var a = 0;

                            List<String> myList = [];

                            for (a = 0; a < myText.length; a  ) {
                              if (myText.substring(a, a   1) == " ") {
                                myList.add(myText.substring(0, a));
                                myText = myText.substring(a   1, myText.length);
                                a = 0;
                              }
                            }
                            
                            var b = 0;
                            String errorText = "?.; :-";

                            for (b = 0; b < myList.length; b  ) {
                              String checkF = myList[b].substring(0, 1);
                              if (errorText.contains(checkF)) {
                                myList[b] =
                                    myList[b].substring(1, myList[b].length);
                              }

                              String checkL = myList[b].substring(
                                  myList[b].length - 1, myList[b].length);
                              if (errorText.contains(checkL)) {
                                myList[b] = myList[b]
                                    .substring(0, myList[b].length - 1);
                              }
                            }



 myList.add("$inText-${myList.length   1}");
      ref.read(_lengthProvider.state).state = myList.length;




                  },
                )),
            Container(
              color: Colors.amberAccent,
              width: 500,
              child: ListView.builder(
                itemCount: ref.watch(_lengthProvider.state).state,
                itemBuilder: (BuildContext context, int index) {
                  return Text(myList[index]);
                },
              ),
            ),
          ],
        ));
  }
}

uj5u.com熱心網友回復：

我正在簡化代碼段以僅與狀態提供者一起作業

final StateProvider<List<String>> itemsProvider = StateProvider((ref) => []);

class ana1 extends ConsumerWidget {
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return Container(
        width: 400,
        height: 300,
        color: Colors.yellow,
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Expanded(
                child: TextField(
              decoration: InputDecoration(
                border: OutlineInputBorder(),
                labelText: 'Content Text',
              ),
                           onSubmitted: (inText) {
                final sliptIntoWords = inText.split(
                    ","); // Im separating words on , perform your logic here
                final oldItems = ref.read(itemsProvider);
                ref.read(itemsProvider.state).update(
                      (state) => [
                        ...oldItems,
                        ...sliptIntoWords,
                      ],
                    );
              },
            )),
            Expanded(
              child: Container(
                color: Colors.amberAccent,
                child: ListView.builder(
                  itemCount: ref.watch(itemsProvider).length,
                  itemBuilder: (BuildContext context, int index) {
                    return Text(ref.watch(itemsProvider)[index]);
                  },
                ),
              ),
            ),
          ],
        ));
  }
}

ListView我認為使用 cosumer 會更好

標籤：扑 镖 列表显示 河荚

上一篇：ListView構建器在應該僅水平擴展時垂直擴展[顫動]

下一篇：在Flutter中，如何讓每個Row的孩子和最大的孩子一樣大？