'Flutter editable (table like widget) not updating with GetX

By using the Editable widget (https://pub.dev/packages/editable), I'm trying to implement a CSV editor. After selecting a dataset (from dropdown), I make an API query to get the data. But the editable table doesn't update (I'm using GetX for state management).

I made this custom widget :

class DatasetTable extends StatelessWidget {
  final List headers;
  final List rows;

  const DatasetTable({
    Key? key,
    required this.headers,
    required this.rows,
  }) : super(key: key);

Widget build(BuildContext context) {
    return SingleChildScrollView(
      scrollDirection: Axis.horizontal,
      child: Editable(
        columns: headers,
        rows: rows,
        showCreateButton: true,
        thSize: 15,
        columnRatio: 0.08,
        showSaveIcon: true,
        borderWidth: 0.8,
        thPaddingTop: 3.5,
        thPaddingBottom: 3.5,
        onRowSaved: (value) {
          print(value);
        },
      ),
    );
  }
}

And inside my main page, I'm calling it like this :

Obx(() => DatasetTable(
                          headers: mainController.headers.value,
                          rows: mainController.rows.value,
                      ),
                    ),

In my MainController :

final headers = [].obs;
final rows = [].obs;

void setRowsAndHeaders(head, row) {
    headers.value = head;
    rows.value = row;
}

I printed the data received inside the build function of DatasetTable widget, and it was the correct data (received from the query). But yet the widget didn't update.

I noticed that when I move to another page and come back, the widget gets updated.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source