How to reactively move an element in an array from a child component?

Question

Vue.js

There is an editor component. Consists of blocks of content. Each block is an element of the content array. There are buttons for adding a block. How to make up and down buttons, and delete an element? Those. changing the position of an element in the array, observing the approximate structure of the components, as in the example here? At the same time without killing reactivity?
https://codesandbox.io/s/vue-template-k0dbr

Answer 1

Copy the array, swap the elements, send it to the parent. For example .