更新头像
<h5>接口描述</h5>
<ul>
<li>更新头像</li>
</ul>
<h5>请求URL</h5>
<ul>
<li><code>/api/user/avatar</code></li>
</ul>
<h5>请求方式</h5>
<ul>
<li>POST</li>
</ul>
<h5>请求头部</h5>
<table>
<thead>
<tr>
<th style="text-align: left;">参数名</th>
<th style="text-align: left;">必选</th>
<th style="text-align: left;">类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left;">Authorization</td>
<td style="text-align: left;">是</td>
<td style="text-align: left;">string</td>
<td>JWT token</td>
</tr>
</tbody>
</table>
<h5>Body 请求参数</h5>
<table>
<thead>
<tr>
<th style="text-align: left;">参数名</th>
<th style="text-align: left;">必选</th>
<th style="text-align: left;">类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left;">avatar</td>
<td style="text-align: left;">是</td>
<td style="text-align: left;">string</td>
<td>头像,上传文件的key</td>
</tr>
</tbody>
</table>
<h5>返回示例</h5>
<ul>
<li>
<p>状态码 204 请求成功</p>
</li>
<li>状态码 422 参数错误</li>
</ul>
<pre><code>{
"message": "The given data was invalid.",
"errors": {
"avatar": [
"头像 不能为空"
]
},
"status_code": 422,
}</code></pre>
<pre><code>export function uploadAvatar(data) {
return request({
url:'/api/user/avatar',
headers: {'Content-Type': 'multipart/form-data'},
method:'post',
data
})
}</code></pre>
<pre><code>const afterRead= (file) => {
let fd = new FormData()
fd.append('avatar', file.file)
uploadAvatar(fd).then(res=>{
if(res.status == '200') {
state.user.avatar_url = res.data.avatar;
}
})
}</code></pre>
<pre><code><div class="avatar">
<van-uploader :after-read="afterRead" :accept="'image/*'">
<img :src="user.avatar_url"/>
</van-uploader>
</div></code></pre>