Update child table field property not take effect immediately

I am trying to change the position of columns in the sales invoice for items.
When I choose to “Update Stock”, I want the warehouse column to appear within items.
The code works but does not work directly, but I need to reload the page.

frappe.ui.form.on("Sales Invoice", {
setup: function(frm) {

    frm.trigger("update_stock");
},
refresh: function(frm) {

    frm.trigger("update_stock");
},
update_stock: (frm) => {
    const warehouse_field = frappe.meta.get_docfield("Sales Invoice Item", "warehouse", frm.doc.name);
    const item_field = frappe.meta.get_docfield("Sales Invoice Item", "item_code", frm.doc.name);
    const qty_field = frappe.meta.get_docfield("Sales Invoice Item", "qty", frm.doc.name);
    if (frm.doc.update_stock){
        warehouse_field.in_list_view = 1;
        warehouse_field.idx = 3;
        warehouse_field.columns = 2;
        item_field.columns =3;
        qty_field.columns =1;
        refresh_field("items");
    }else{
        warehouse_field.in_list_view = 0;
        warehouse_field.columns = 0;
        item_field.columns =4;
        qty_field.columns =2;
        refresh_field("items");
    }
},
});