top of page

[Flutter/Dart] Numbering of id when adding a new item


Issue

Assumptions

  • Register and save multiple items

  • Items are managed with a unique id

  • State management is redux The flow of adding a new item is as follows

  1. Dispatch AddItemAction with the input from the user as an argument in the view

  2. Register {id, item} in store with reducer

  3. Register {id, item} in remote database with middleware


Issue

  • Where to number the id when adding a new itemAccording to the flow above, there are three candidates for numbering: view, reducer, and middleware.


Solution

I think it's better to use middleware for numbering.


When numbering in view, there are the following problems.

  • Duplicate processing when adding items from multiple different pages or UIs

  • Id is a variable related to state management within the app, and the view should not know it (separation of concerns)

When numbering with reducer, there are the following problems.

  • Middleware can't know new id


Details

In the following, I will describe the detail method to add with middleware.


The biggest issue is how to convey the id numbered by middleware to the reducer.

To deal with this:

  1. Define AddItemAction(Item) and AddItemWithIdAction(Item, int)

  2. View dispatch AddItemAction based on user input

  3. When middleware detects AddItemAction, it numbers a new id and dispatches AddItemWithIdAction

  4. Reducer does nothing for AddItemAction. When AddItemWithIdAction is detected, add argument id and item to store

The code looks like this:

//Action

class AddItemAction{
  final Item item;

  AddItemAction(this.item);
}

class AddItemWithIdAction{
  final Item item;
  final int id;

  AddItemWithIdAction({required this.id, required this.item});
}
//middleware

void AppStateMiddleWare(Store<AppState> store, dynamic action,
 NextDispatcher next) async {

  if(action is AddItemAction){

    int id = getId();  //number new id
    store.dispatch(
      AddItemWithIdAction(id: id, item: action.item)
    );
  }
  
  
  next(action);
  
  if (action is AddItemWithIdAction){
    saveToDB(action.id, action.item);  //save to database
  }
}
AppState appStateReducer(AppState state, action){

  if (action is AddItemWithIdAction){
   return addItem(action.id, action.item, state);  
   //save {id, item} to store
  }
  
  return state;
}


Lastly

If you try to follow the framework, there will be various restrictions.

Recent Posts

See All

[Flutter/Dart] Format string with TextField

What want to do I want to create an input form using TextField. For example, if the input content is a monetary amount, I would like to display it in 3-digit delimiters with a ¥ prefix. Rather than ha

Comments


Let's do our best with our partner:​ ChatReminder

iphone6.5p2.png

It is an application that achieves goals in a chat format with partners.

google-play-badge.png
Download_on_the_App_Store_Badge_JP_RGB_blk_100317.png

Let's do our best with our partner:​ ChatReminder

納品:iPhone6.5①.png

It is an application that achieves goals in a chat format with partners.

google-play-badge.png
Download_on_the_App_Store_Badge_JP_RGB_blk_100317.png

Theme diary: Decide the theme and record for each genre

It is a diary application that allows you to post and record with themes and sub-themes for each genre.

google-play-badge.png
Download_on_the_App_Store_Badge_JP_RGB_blk_100317.png
bottom of page