vue中 配合elementUI实现 勾选多选框在指定区域添加相应数据并实现联动效果

vue中 配合elementUI实现 勾选多选框在指定区域添加相应数据
今天在做项目中遇到了小问题，实现勾选按钮在指定区域添加数据并实现联动效果

如上图：勾选按钮 在下侧添加数据 并实现联动
不废话 上代码：
数据自定义的对象结构：

数据格式如下：
textarea ：''，//存放联动数据
xzTypeList:{
        '协助司法送达':'协助司法送达：请协助法院完成对被执行人的送达，并将被执行人地址、是否在家等有助于送达的信息反馈给执行法官。',
        '协助行踪查找':'协助行踪查找：请反馈被执行人的目前工作地点、是否在本地、出行规律等信息。',
        '协助财产调查':'协助财产调查：请反馈被执行人的车辆、房产、所有工厂、门面、店铺等财产线索。',
        '婚姻家庭情况':'婚姻家庭情况：请反馈被执行人的夫妻感情、婚史等情况。',
        '人际关系反馈':'人际关系反馈：请反馈被执行人的人际交往情况。',
        '执行风险反馈':'执行风险反馈：请反馈执行风险情况。',
        '协助信访维稳':'协助信访维稳：请反馈被执行人是否有信访风险及相关情况。'
      }

js：
这里用来接收循环的结果，因为循环每次都会输出，不能把 this.textarea直接放到循环中  否则数据会重复添加，因此定义一个let textareaText 空字符串用来存储临时循环数据
	let textareaText = ''
      for(let i=0;i

图片如下：

希望对大家有所帮助，谢谢！