CODEWITHSUNDEEP
vue.js
Lucas
Lucas

Reputation: 47

call API to change order of the array in vue?

I am having an array of objects like this. I need to send an API request to the database to change their display order. How can I pass order_position into the body of an API request? I intend to send an API request after clicking the confirm button. Should I send an API request every time the up and down arrows are pressed? Please help me, this problem is really hard for me

getFolders() {
    let data: any[] = [
      {
        id: 100,
        name: '店舗',
        order_position: 1
      },
      {
        id: 101,
        name: '東日本統括部',
        order_position: 2
      },
      {
        id: 102,
        name: '東日本統',
        order_position: 3
      }
    ]
    this.list_folders = data
  }

enter image description here

Upvotes: 0

Views: 196

Answers (1)

Gangadhar Darsi
Gangadhar Darsi

Reputation: 176

if you would like to use vue-draggable, probably you can try this way

  1. use vue-draggable to rearrange element's order
  2. whenever you drag an item it will trigger an event 'change'(@change)
  3. there you can rearrange the order_position property with the index
  4. send the whole array to backend and update with id or ( truncate and reinsert) hope this may help you

Upvotes: 1

Related Questions