Flutter future double data issue - flutter

Question

I am using Futurebuilder to show List issue is its running function 2 time or 3 times i dont know and showing data 2 times.
My function code
getCustomerList() async {
customerS = [];
print('check running');
final storage = new FlutterSecureStorage();
String uUid = await storage.read(key: "uUid");
CollectionReference _collectionRef =
FirebaseFirestore.instance.collection('Transaction');
QuerySnapshot querySnapshot =
await _collectionRef.get();
// Get data from docs and convert map to List
List allData = querySnapshot.docs.where((element) => element['CustomerID'] == widget.data['customerID'])
.map((doc) => doc.data())
.toList();
print(allData);
print('allData length ${allData.length}' );
for (int i = 0; i < allData.length; i++) {
print(allData[i]);
customerS.add(allData[i]);
}
print(customerS);
print('cus length ${customerS.length}' );
return customerS;
}
My future builder code
FutureBuilder(
future: getCustomerList(),
builder: (context, snapshot) {
print('snapshot length ${snapshot.data.length}');
print(snapshot);
print(snapshot.data);
if (snapshot.hasData)
return ListView.builder(
shrinkWrap: true,
itemCount: snapshot.data.length,
itemBuilder: (BuildContext context, int index) {
print('List length ${snapshot.data.length}');
return Padding(
padding: const EdgeInsets.only(left: 13, right: 13),
child: Container(
decoration: BoxDecoration(
border: Border(
top: BorderSide(color: Colors.grey, width: .5)),
),
child: Padding(
padding: const EdgeInsets.all(13.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'10th May ',
style: TextStyle(fontFamily: 'PoppinsMedium'),
),
Text(
snapshot.data[index]['give'].toString(),
style: TextStyle(
fontFamily: 'PoppinsMedium',
color: Colors.green),
),
],
),
),
),
);
},
);
else
return Text('Result: ${snapshot.data.body}');
}
),
Issue is i have only 2 arrays in list but its showing for look like its running two time i am also try to clear the array but nothing work.
You can look on this picture
enter image description here
I have only 2 array which are in red circle and its showing double can see in blue circle.

Answer 1

Why you are using customerS I mean its saving data in this by initState and when Future call its double.
Remove it from initState and just simply return allData like this
getCustomerList() async {
customerS.clear();
print('check running');
final storage = new FlutterSecureStorage();
String uUid = await storage.read(key: "uUid");
CollectionReference _collectionRef =
FirebaseFirestore.instance.collection('Transaction');
QuerySnapshot querySnapshot = await _collectionRef.get();
// Get data from docs and convert map to List
List allData = querySnapshot.docs
.where((element) => element['CustomerID'] == widget.data['customerID'])
.map((doc) => doc.data())
.toList();
print(allData);
return allData;
}

Answer 2

From the docs:
The future must have been obtained earlier, e.g. during State.initState, State.didUpdateWidget, or State.didChangeDependencies. It must not be created during the State.build or StatelessWidget.build method call when constructing the FutureBuilder. If the future is created at the same time as the FutureBuilder, then every time the FutureBuilder's parent is rebuilt, the asynchronous task will be restarted.
This line:
FutureBuilder(
future: getCustomerList(), <- this line
...
)