流程具体如下
一、 使用场景
- 我们如果经常用到图片的上传时,可以封装成全局的一个组件使用 v-model 进行绑定即可
二、 实现原理
- 我们先要请求后台头像数据存入父组件的data里面图片属性
- 然后通过给子组件绑定一个 v-model 给子组件传值,子组件使用props接收后渲染到图片区域
- 用户点击更换图片后,下载腾讯云储存桶的包使用其Api向腾讯云上传图片数据并且同时会返回这个图片的url地址
- 然后子组件通过$emit向父组件传腾讯云返回的url的值并且赋值给data定义的图片属性,然后子组件也会接收到父组件里面图片地址的更新,子组件也会同步更新,就会重新渲染一直新的图片
- 点击保存或者提交之后会发送请求将新的图片url地址存入服务器中