Vue Updated or undo pattern with child component

I have a problem with updating the correct object from a child component.

My setup is as following: One ul list with most of the data that I want to present or edit. On one part of the "li", there is a child component to show that part of the data, which is a list of resources connected to that object, and also to handle the push of new resources.

I also want the user to have a button the enable edit mode of the row, and then buttons for Update and Cancel.

The problem I'm facing, is to figure out which object I should edit and then save. What I'm doing now, is trying to copy the data in row into a mutableRow that I'm then using as my model for the input controls, while the actual row data is being shown when the user is not in edit mode. In the update method, I post to the db and updated the row object.

ul
  li(v-for="row in rows")
    p(v-if="!row.editing") 
    input(v-else, v-model="mutableRow.name")
    resources(:row="row")
    button(v-if="!row.editing") Start edit
    template(v-else)
      button Update
      button Cancel

Is this the correct way to do it and if so, how should I handle the prop being sent to my child component? I've tried fetching the mutableRow via this.$parent.mutableRow, I've tried switching the "resource(:row="row")" with a v-if and send in mutableRow if in edit mode, but then I end up changing both objects from the component some how.

Is there another pattern I could use here?