返回类型不是小部件:SetState问题

时间:2019-06-13 14:34:58

标签: flutter dart

我在更新页面时遇到问题: 我想在我的Page中包含StatelessWidget和itemBuilder。窗口小部件将用Cards构建一个ListView。 LongPress应该删除卡并更新页面,但不会更新。这是不可能的,因为它是一个无状态的Widget。

我已经尝试过将StatlessWidget制成StatefullWidget,但是在itemBuilder中,我收到一条错误消息,指出返回类型“ ProductList(..)”不是小部件

List<String> artikelNamen = [];
List<int> barcodes = [];

class WiederaufnahmePage extends StatefulWidget {
  @override
  _WiederaufnahmePageState createState() => _WiederaufnahmePageState();
}

class ProductList extends StatelessWidget {
  final String artb;
  final int brcde;
  final int indx;

  ProductList(this.artb, this.brcde, this.indx);

  @override
  Widget build(BuildContext context) {
    return new Card(
        child: ListTile(
          title: Text(artb,
          style: TextStyle(fontWeight: FontWeight.w500, fontSize: 20)),
          subtitle: Text(brcde.toString()),
          leading: Icon(
            Icons.fastfood,
            color: Colors.blue[500],
          ),
          trailing: Icon(Icons.keyboard_arrow_right),
          onTap: () {
            Navigator.pushNamed(context, "/BarcodePage");
          },
          onLongPress: () {
            _showSnackBar(artb);
            artikelNamen.removeAt(indx);
            barcodes.removeAt(indx);
            //setState(() {}); //This isn't working bc StatelessWidget
         },
    ));
  }
}

class _WiederaufnahmePageState extends State<WiederaufnahmePage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
           child: Expanded(
              child: SizedBox(
                  height: 200.0,
                  child: new ListView.builder(
                    reverse: false,
                    itemBuilder: (_, int index) => ProductList(
                        artikelNamen[index], barcodes[index], index),
                    itemCount: artikelNamen.length,
                  )
              )),
          ))
  }   
}

我不知道如何解决这个问题。显示的代码是实际的工作代码,我想在ListTile上每次LongPress之后实施整个页面的更新,以便删除的Tile不再可见。

1 个答案:

答案 0 :(得分:0)

首先是一种好的做法,将变量代码移到StatefulWidget的状态,在这种情况下,ArtikelNamen和条形码不应由ProductList访问。

然后,更改StatelessWidget以接收onLongPress的回调函数,并将其分配给卡。然后,您可以将onLongPress函数移至StatefulWidget(调用setState)并将其作为参数传递给无状态小部件。

您可以尝试以下操作:

import 'package:flutter/material.dart';

class WiederaufnahmePage extends StatefulWidget {
  @override
  _WiederaufnahmePageState createState() => _WiederaufnahmePageState();
}

class _WiederaufnahmePageState extends State<WiederaufnahmePage> {
  List<String> artikelNamen = ['item 1', 'item 2', 'item 3'];
  List<int> barcodes = [0, 1, 2];
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(8.0),
      child: ListView.builder(
        reverse: false,
        itemBuilder: (BuildContext context, int index) => ProductList(
            artikelNamen[index], barcodes[index], () => onLongPress(index)),
        itemCount: artikelNamen.length,
      ),
    );
  }

  void onLongPress(int indx) {
    //_showSnackBar(artb);
    setState(() {
      artikelNamen.removeAt(indx);
      barcodes.removeAt(indx);
    });
  }
}

class ProductList extends StatelessWidget {
  final String artb;
  final int brcde;
  final onLongPress;

  ProductList(this.artb, this.brcde, this.onLongPress);

  @override
  Widget build(BuildContext context) {
    return new Card(
        child: ListTile(
      title: Text(artb,
          style: TextStyle(fontWeight: FontWeight.w500, fontSize: 20)),
      subtitle: Text(brcde.toString()),
      leading: Icon(
        Icons.fastfood,
        color: Colors.blue[500],
      ),
      trailing: Icon(Icons.keyboard_arrow_right),
      onTap: () {
        Navigator.pushNamed(context, "/BarcodePage");
      },
      onLongPress: onLongPress,
    ));
  }
}