如何组件数据服务器网洛,如何将组件数据作为json发送到服务器？

import TextBlock from './blocks/TextBlock.vue'

import ImageBlock from './blocks/ImageBlock.vue'

export default {

data: function data() {

return {

blockList: ['text-block', 'image-block', 'text-block']

}

},

props: {

blocks: {type: Array}

},

// afterMount() {

// this.blocks.push(['text-block']);

// },

components: {

TextBlock,

ImageBlock

}

}

所以只是为了检验一切工作我手动添加一些组件：黑名单：“文本块”，“图像块”，“文本块”]

和一切呈现在页面上罚款。但是，我不会手动添加组件，但我会让用户添加它们，用户将能够添加任意数量的组件。当前有2个组件会使用更多的组件。

当我添加可以说10个不同的组件到页面和用户按保存按钮，我会怎么去发送这个数据到服务器？我不能只将blockList数组发送到服务器，因为这只是一个字符串数组。

我想要做的是跟踪所有已添加的组件，然后用按钮将所有组件及其属性的属性(如果我已将任何文本输入到文本组件中)发送到服务器的json ，或者如果我已经将图像上传到图像组件中，则需要将所有数据发送到服务器，以便在稍后重新加载页面以供再次编辑时重新创建它。

那么我怎么能做到这一点作为blockList：['文本块'，'图像块'，'文本块']不会做？如何保存一组组件及其所有属性，并按下按钮将其发送给服务器？