Question

我正在开发一个送餐应用程序，我试图为列表中的特定产品创建增量减量系统。一开始它可以工作let deck = [ "r0", "r1", "r2", "r3", "r4", "r5", "r6", "r7", "r8", "r9", "r1", "r2", "r3", "r4", "r5", "r6", "r7", "r8", "r9", "rSkip", "rSkip", "rReverse", "rReverse", "r+2", "r+2", "b0", "b1", "b2", "b3", "b4", "b5", "b6", "b7", "b8", "b9", "b1", "b2", "b3", "b4", "b5", "b6", "b7", "b8", "b9", "bSkip", "bSkip", "bReverse", "bReverse", "b+2", "b+2", "g0", "g1", "g2", "g3", "g4", "g5", "g6", "g7", "g8", "g9", "g1", "g2", "g3", "g4", "g5", "g6", "g7", "g8", "g9", "gSkip", "gSkip", "gReverse", "gReverse", "g+2", "g+2", "y0", "y1", "y2", "y3", "y4", "y5", "y6", "y7", "y8", "y9", "y1", "y2", "y3", "y4", "y5", "y6", "y7", "y8", "y9", "ySkip", "ySkip", "yReverse", "yReverse", "y+2", "y+2", "Wild", "Wild", "Wild", "Wild", "Wild+4", "Wild+4", "Wild+4", "Wild+4" ]; function shuffleDeck() { for (let i = 0; i <= deck.length; i++) { let randomNum = Math.floor(Math.random() * deck.length); deck.splice(randomNum, 0, deck[0]); deck.splice(0, 1, deck[randomNum + 1]); deck.splice(randomNum + 1, 1); } } function player() { this.hand = []; }; let Player1 = new player(); let Player2 = new player(); let Player3 = new player(); let humanPlayers = []; //initialize the participants initializePlayers = prompt("How many players? (1-4)"); if (initializePlayers < 4) { let initializeString2Num = parseInt(initializePlayers); for (let j = 0; j <= initializeString2Num - 1; j++) { //pushing human objects into array switch (initializePlayers) { case "1": humanPlayers.push(Player1); break; case "2": humanPlayers.push(Player2); break; case "3": humanPlayers.push(Player3); break; } } } shuffleDeck(); dealCards(humanPlayers.length); function dealCards(humans) { console.log("number of humans to deal to " + humanPlayers.length); switch (humans) { case 3: let dealtCard; console.log("case 3"); for (let l = 0; l <= 7; l++) { if (l <= 6) { dealtCard = deck.shift(); } if (humanPlayers[0].hand.length <= 6) { humanPlayers[0].hand.push(dealtCard); console.log(dealtCard); } } for (let m = 0; m <= 7; m++) { if (m <= 6) { dealtCard = deck.shift(); } if (humanPlayers[1].hand.length <= 6) { humanPlayers[1].hand.push(dealtCard); console.log(dealtCard); } } for (let n = 0; n <= 7; n++) { if (n <= 6) { dealtCard = deck.shift(); } if (humanPlayers[2].hand.length <= 6) { humanPlayers[2].hand.push(dealtCard); console.log(dealtCard); } } break; } } console.log(humanPlayers);，但是在计数器自动按下i.e the counter increases之后不久，无需按下任何按钮。我不知道为什么会发生

下面是我正在尝试的代码

这是课程

这是从网址获取数据的功能

class ItemData {
  final String itemName;
  final String itemPrice;
  final String image;
  int counter = 0;
  bool isAdded = false;
  ItemData({this.itemName, this.itemPrice, this.image});
}

这是将来的构建器中提取产品的代码

  Future<List<ItemData>> _getProducts() async {
    var data = await http
        .get("https://orangecitycafe.in/app_configs/products_display.php");

    var jsonData = json.decode(data.body);
    List<ItemData> details = [];
    for (var p in jsonData) {
      ItemData detail = ItemData(
          itemName: p["product_name"],
          itemPrice: p["product_price"],
          image: p["product_image"]);
      details.add(detail);
    }
    return details;
  }

其余的都起作用，但是只有当我增加计数器时，计数器才会增加，并且在一段时间后它会自动返回到Widget _myCart() { return FutureBuilder( future: _getProfile(), builder: (BuildContext context, AsyncSnapshot snapshot) { if (snapshot.hasData) { return ListView.builder( itemCount: snapshot.data.length, itemBuilder: (BuildContext context, int index) { return ListTile( title: Text(snapshot.data[index].itemName), leading: Image.network("https://www.orangecitycafe.in/" + snapshot.data[index].image), trailing: snapshot.data[index].isAdded ? Row( mainAxisSize: MainAxisSize.min, children: <Widget>[ IconButton( icon: Icon(Icons.remove), onPressed: () { setState(() { if (snapshot.data[index].counter > 0) { snapshot.data[index].counter--; } }); }, color: Colors.green, ), Text(snapshot.data[index].counter.toString()), IconButton( icon: Icon(Icons.add), color: Colors.green, onPressed: () { setState(() { snapshot.data[index].counter++; }); }, ), ], ) : RaisedButton( onPressed: (){ setState(() { snapshot.data[index].isAdded = true; }); }, child: Text("Add"), ), ); }, ); } else { return Container(); } }, ); }

Answer 1

您可以在下面复制粘贴运行完整代码
您可以使用以下方式在Future中使用FutureBuilder，以避免setState导致FutureBuilder再次重建。
详细原因https://github.com/flutter/flutter/issues/11426#issuecomment-414047398
每次发出重建文件时，都会调用didUpdateWidget状态的FutureBuilder。此函数检查旧的旧对象是否与新的旧对象不同，如果有，则重新触发FutureBuilder。

要克服这一点，我们可以在构建函数之外的其他地方调用Future。例如，在initState中，将其保存在成员变量中，然后将此变量传递给FutureBuilder。

代码段

Future<List<ItemData>> _future;
...
@override
  void initState() {
    _future = _getProducts();
    super.initState();
  }
...
  Widget _myCart() {
    return FutureBuilder(
      future: _future,

工作演示

完整代码

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

class ItemData {
  final String itemName;
  final String itemPrice;
  final String image;
  int counter = 0;
  bool isAdded = false;
  ItemData({this.itemName, this.itemPrice, this.image});
}

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  Future<List<ItemData>> _future;

  Future<List<ItemData>> _getProducts() async {
    var data = await http
        .get("https://orangecitycafe.in/app_configs/products_display.php");

    var jsonData = json.decode(data.body);
    List<ItemData> details = [];
    for (var p in jsonData) {
      ItemData detail = ItemData(
          itemName: p["product_name"],
          itemPrice: p["product_price"],
          image: p["product_image"]);
      details.add(detail);
    }
    return details;
  }

  @override
  void initState() {
    _future = _getProducts();
    super.initState();
  }

  Widget _myCart() {
    return FutureBuilder(
      future: _future,
      builder: (BuildContext context, AsyncSnapshot snapshot) {
        if (snapshot.hasData) {
          return ListView.builder(
            itemCount: snapshot.data.length,
            itemBuilder: (BuildContext context, int index) {
              return ListTile(
                title: Text(snapshot.data[index].itemName),
                leading: Image.network("https://www.orangecitycafe.in/" +
                    snapshot.data[index].image),
                trailing: snapshot.data[index].isAdded
                    ? Row(
                        mainAxisSize: MainAxisSize.min,
                        children: <Widget>[
                          IconButton(
                            icon: Icon(Icons.remove),
                            onPressed: () {
                              setState(() {
                                if (snapshot.data[index].counter > 0) {
                                  snapshot.data[index].counter--;
                                }
                              });
                            },
                            color: Colors.green,
                          ),
                          Text(snapshot.data[index].counter.toString()),
                          IconButton(
                            icon: Icon(Icons.add),
                            color: Colors.green,
                            onPressed: () {
                              setState(() {
                                snapshot.data[index].counter++;
                              });
                            },
                          ),
                        ],
                      )
                    : RaisedButton(
                        onPressed: () {
                          setState(() {
                            snapshot.data[index].isAdded = true;
                          });
                        },
                        child: Text("Add"),
                      ),
              );
            },
          );
        } else {
          return Container();
        }
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text(widget.title),
        ),
        body: _myCart());
  }
}

如何在颤振中对特定产品进行递增和递减

1 个答案: