@shixinde/vuepress-theme-init
Version:
170 lines • 76.7 kB
JavaScript
import{_ as n,c as s,o as a,a as t}from"./app-Dx9bNbfq.js";const p={},e=t(`<h2 id="修改头像和昵称" tabindex="-1"><a class="header-anchor" href="#修改头像和昵称"><span>修改头像和昵称</span></a></h2><div class="language-vue line-numbers-mode" data-highlighter="prismjs" data-ext="vue" data-title="vue"><pre class="language-vue"><code><span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>template</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>container<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>card<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>item flex align-center space-between<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>label<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line"> 头像</span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>avatar<span class="token punctuation">"</span></span> <span class="token attr-name">open-type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>chooseAvatar<span class="token punctuation">"</span></span> <span class="token attr-name">@chooseavatar</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>chooseavatar<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>image</span> <span class="token attr-name">:src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>userInfo.headimg<span class="token punctuation">"</span></span> <span class="token attr-name">mode</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>image</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>item flex align-center space-between<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>label<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line"> 昵称</span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>value<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>nickname<span class="token punctuation">"</span></span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>userInfo.username<span class="token punctuation">"</span></span> <span class="token attr-name">@change</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>getname<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>用户昵称<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>options flex center<span class="token punctuation">"</span></span> <span class="token attr-name">@click</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>submit<span class="token punctuation">"</span></span> <span class="token punctuation">></span></span></span>
<span class="line"> 保存</span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>template</span><span class="token punctuation">></span></span></span>
<span class="line"></span>
<span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript"></span>
<span class="line"> <span class="token keyword">import</span> <span class="token punctuation">{</span></span>
<span class="line"> getInfo<span class="token punctuation">,</span>update</span>
<span class="line"> <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"@/api/user.js"</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token keyword">import</span> <span class="token punctuation">{</span> upload <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"@/api/index.js"</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token function">data</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token keyword">return</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">userInfo</span><span class="token operator">:</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token literal-property property">sexRange</span><span class="token operator">:</span> <span class="token punctuation">[</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">id</span><span class="token operator">:</span> <span class="token string">'男'</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'男'</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">id</span><span class="token operator">:</span> <span class="token string">'女'</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'女'</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">]</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token function">onLoad</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">getInfo</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token literal-property property">methods</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token function">getname</span><span class="token punctuation">(</span><span class="token parameter">e</span><span class="token punctuation">)</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token keyword">this</span><span class="token punctuation">.</span>userInfo<span class="token punctuation">.</span>username <span class="token operator">=</span> e<span class="token punctuation">.</span>detail<span class="token punctuation">.</span>value<span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token function">chooseavatar</span><span class="token punctuation">(</span><span class="token parameter">e</span><span class="token punctuation">)</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token keyword">let</span> that <span class="token operator">=</span> <span class="token keyword">this</span><span class="token punctuation">;</span></span>
<span class="line"> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">'event'</span><span class="token punctuation">,</span>e<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token function">upload</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">filePath</span><span class="token operator">:</span> e<span class="token punctuation">.</span>detail<span class="token punctuation">.</span>avatarUrl<span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token parameter">ras</span><span class="token operator">=></span><span class="token punctuation">{</span></span>
<span class="line"> that<span class="token punctuation">.</span>userInfo<span class="token punctuation">.</span>headimg <span class="token operator">=</span> ras<span class="token punctuation">.</span>info<span class="token punctuation">.</span>url<span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"> </span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token function">submit</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token function">update</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">data</span><span class="token operator">:</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">headimg</span><span class="token operator">:</span><span class="token keyword">this</span><span class="token punctuation">.</span>userInfo<span class="token punctuation">.</span>headimg<span class="token punctuation">,</span></span>
<span class="line"> <span class="token literal-property property">username</span><span class="token operator">:</span><span class="token keyword">this</span><span class="token punctuation">.</span>userInfo<span class="token punctuation">.</span>username<span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token parameter">res</span><span class="token operator">=></span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token keyword">if</span><span class="token punctuation">(</span>res<span class="token punctuation">.</span>code <span class="token operator">==</span> <span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">{</span></span>
<span class="line"> uni<span class="token punctuation">.</span><span class="token function">showToast</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">'保存成功'</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token function">setTimeout</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token operator">=></span><span class="token punctuation">{</span></span>
<span class="line"> uni<span class="token punctuation">.</span><span class="token function">navigateBack</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> </span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> </span>
<span class="line"> <span class="token function">sexChange</span><span class="token punctuation">(</span><span class="token parameter">e</span><span class="token punctuation">)</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token keyword">this</span><span class="token punctuation">.</span>userInfo<span class="token punctuation">.</span>base_sex <span class="token operator">=</span> <span class="token keyword">this</span><span class="token punctuation">.</span>sexRange<span class="token punctuation">[</span>e<span class="token punctuation">.</span>detail<span class="token punctuation">.</span>value<span class="token punctuation">]</span><span class="token punctuation">.</span>name<span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token function">getInfo</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token function">getInfo</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">data</span><span class="token operator">:</span> <span class="token punctuation">{</span><span class="token punctuation">}</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token parameter">res</span> <span class="token operator">=></span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token keyword">this</span><span class="token punctuation">.</span>userInfo <span class="token operator">=</span> res<span class="token punctuation">.</span>data<span class="token punctuation">.</span>user<span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token function">goAddress</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line"> uni<span class="token punctuation">.</span><span class="token function">navigateTo</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token string">'/pages/me/address-list'</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span></span>
<span class="line"></span>
<span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>style</span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>scss<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token style"><span class="token language-css"></span>
<span class="line"> <span class="token selector">.card</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token property">margin-top</span><span class="token punctuation">:</span> 10upx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">background</span><span class="token punctuation">:</span> <span class="token function">rgba</span><span class="token punctuation">(</span>255<span class="token punctuation">,</span> 255<span class="token punctuation">,</span> 255<span class="token punctuation">,</span> 1<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">padding</span><span class="token punctuation">:</span> 0 30upx<span class="token punctuation">;</span></span>
<span class="line"></span>
<span class="line"> <span class="token selector">.item</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token property">border-bottom</span><span class="token punctuation">:</span> 1px solid <span class="token function">rgba</span><span class="token punctuation">(</span>229<span class="token punctuation">,</span> 229<span class="token punctuation">,</span> 229<span class="token punctuation">,</span> 1<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">height</span><span class="token punctuation">:</span> 100upx<span class="token punctuation">;</span></span>
<span class="line"></span>
<span class="line"> <span class="token selector">&:last-child</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token property">border</span><span class="token punctuation">:</span> none<span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"></span>
<span class="line"> <span class="token selector">.label</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token property">color</span><span class="token punctuation">:</span> <span class="token function">rgba</span><span class="token punctuation">(</span>0<span class="token punctuation">,</span> 0<span class="token punctuation">,</span> 0<span class="token punctuation">,</span> 1<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">font-size</span><span class="token punctuation">:</span> 30rpx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"></span>
<span class="line"> <span class="token selector">.value</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token property">color</span><span class="token punctuation">:</span> <span class="token function">rgba</span><span class="token punctuation">(</span>128<span class="token punctuation">,</span> 128<span class="token punctuation">,</span> 128<span class="token punctuation">,</span> 1<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">font-size</span><span class="token punctuation">:</span> 28rpx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">text-align</span><span class="token punctuation">:</span> right<span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"></span>
<span class="line"> <span class="token selector">span</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token property">display</span><span class="token punctuation">:</span> block<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">font-size</span><span class="token punctuation">:</span> 36upx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">margin-left</span><span class="token punctuation">:</span> 16upx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">transform</span><span class="token punctuation">:</span> <span class="token function">scaleX</span><span class="token punctuation">(</span>0.5<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"></span>
<span class="line"> <span class="token selector">.avatar</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token property">width</span><span class="token punctuation">:</span> 70rpx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">height</span><span class="token punctuation">:</span> 70rpx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">border-radius</span><span class="token punctuation">:</span> 50%<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">margin</span><span class="token punctuation">:</span> 0<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">padding</span><span class="token punctuation">:</span> 0<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">background</span><span class="token punctuation">:</span> none<span class="token punctuation">;</span></span>
<span class="line"> <span class="token selector">&::after</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token property">border</span><span class="token punctuation">:</span> none<span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"> <span class="token selector">image</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token property">width</span><span class="token punctuation">:</span> 70upx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">height</span><span class="token punctuation">:</span> 70upx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">border-radius</span><span class="token punctuation">:</span> 50%<span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"></span>
<span class="line"> <span class="token selector">page</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token property">background</span><span class="token punctuation">:</span> <span class="token function">rgba</span><span class="token punctuation">(</span>247<span class="token punctuation">,</span> 247<span class="token punctuation">,</span> 250<span class="token punctuation">,</span> 1<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"> <span class="token selector">.options</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token property">width</span><span class="token punctuation">:</span> 690rpx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">height</span><span class="token punctuation">:</span> 94rpx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">background</span><span class="token punctuation">:</span> <span class="token function">rgba</span><span class="token punctuation">(</span>58<span class="token punctuation">,</span> 131<span class="token punctuation">,</span> 251<span class="token punctuation">,</span> 1<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">border-radius</span><span class="token punctuation">:</span> 50rpx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">color</span><span class="token punctuation">:</span> <span class="token function">rgba</span><span class="token punctuation">(</span>255<span class="token punctuation">,</span> 255<span class="token punctuation">,</span> 255<span class="token punctuation">,</span> 1<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">font-size</span><span class="token punctuation">:</span> 36rpx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">line-height</span><span class="token punctuation">:</span> 36rpx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">position</span><span class="token punctuation">:</span> fixed<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">bottom</span><span class="token punctuation">:</span> 50upx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">left</span><span class="token punctuation">:</span> 30upx<span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>style</span><span class="token punctuation">></span></span></span>
<span class="line"></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div>`,2),c=[e];function o(l,u){return a(),s("div",null,c)}const k=n(p,[["render",o],["__file","界面类.html.vue"]]),r=JSON.parse(`{"path":"/%E9%A3%9E%E7%A0%81%E7%AF%87/%E7%95%8C%E9%9D%A2%E7%B1%BB.html","title":"快速界面","lang":"zh-CN","frontmatter":{"title":"快速界面","date":"2022-08-04T00:00:00.000Z","tags":["界面"],"categories":["飞码篇"]},"headers":[{"level":2,"title":"修改头像和昵称","slug":"修改头像和昵称","link":"#修改头像和昵称","children":[]}],"git":{"updatedTime":1727229103000,"contributors":[{"name":"袁果锅","email":"2914310412@qq.com","commits":1}]},"filePathRelative":"飞码篇/界面类.md","excerpt":"<h2>修改头像和昵称</h2>\\n<div class=\\"language-vue\\" data-highlighter=\\"prismjs\\" data-ext=\\"vue\\" data-title=\\"vue\\"><pre class=\\"language-vue\\"><code><span class=\\"line\\"><span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>template</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>view</span> <span class=\\"token attr-name\\">class</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>container<span class=\\"token punctuation\\">\\"</span></span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>view</span> <span class=\\"token attr-name\\">class</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>card<span class=\\"token punctuation\\">\\"</span></span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>view</span> <span class=\\"token attr-name\\">class</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>item flex align-center space-between<span class=\\"token punctuation\\">\\"</span></span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>view</span> <span class=\\"token attr-name\\">class</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>label<span class=\\"token punctuation\\">\\"</span></span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t头像</span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>view</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>button</span> <span class=\\"token attr-name\\">class</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>avatar<span class=\\"token punctuation\\">\\"</span></span> <span class=\\"token attr-name\\">open-type</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>chooseAvatar<span class=\\"token punctuation\\">\\"</span></span> <span class=\\"token attr-name\\">@chooseavatar</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>chooseavatar<span class=\\"token punctuation\\">\\"</span></span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>image</span> <span class=\\"token attr-name\\">:src</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>userInfo.headimg<span class=\\"token punctuation\\">\\"</span></span> <span class=\\"token attr-name\\">mode</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span><span class=\\"token punctuation\\">\\"</span></span><span class=\\"token punctuation\\">></span></span><span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>image</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>button</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>view</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>view</span> <span class=\\"token attr-name\\">class</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>item flex align-center space-between<span class=\\"token punctuation\\">\\"</span></span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>view</span> <span class=\\"token attr-name\\">class</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>label<span class=\\"token punctuation\\">\\"</span></span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t昵称</span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>view</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>view</span> <span class=\\"token attr-name\\">class</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>value<span class=\\"token punctuation\\">\\"</span></span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>input</span> <span class=\\"token attr-name\\">type</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>nickname<span class=\\"token punctuation\\">\\"</span></span> <span class=\\"token attr-name\\">v-model</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>userInfo.username<span class=\\"token punctuation\\">\\"</span></span> <span class=\\"token attr-name\\">@change</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>getname<span class=\\"token punctuation\\">\\"</span></span> <span class=\\"token attr-name\\">value</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span><span class=\\"token punctuation\\">\\"</span></span> <span class=\\"token attr-name\\">placeholder</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>用户昵称<span class=\\"token punctuation\\">\\"</span></span> <span class=\\"token punctuation\\">/></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>view</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>view</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>view</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>view</span> <span class=\\"token attr-name\\">class</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>options flex center<span class=\\"token punctuation\\">\\"</span></span> <span class=\\"token attr-name\\">@click</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>submit<span class=\\"token punctuation\\">\\"</span></span> <span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t\\t\\t保存</span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>view</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\">\\t<span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>view</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\"><span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>template</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\"></span>\\n<span class=\\"line\\"><span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>script</span><span class=\\"token punctuation\\">></span></span><span class=\\"token script\\"><span class=\\"token language-javascript\\"></span>\\n<span class=\\"line\\">\\t<span class=\\"token keyword\\">import</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\tgetInfo<span class=\\"token punctuation\\">,</span>update</span>\\n<span class=\\"line\\">\\t<span class=\\"token punctuation\\">}</span> <span class=\\"token keyword\\">from</span> <span class=\\"token string\\">\\"@/api/user.js\\"</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t<span class=\\"token keyword\\">import</span> <span class=\\"token punctuation\\">{</span> upload <span class=\\"token punctuation\\">}</span> <span class=\\"token keyword\\">from</span> <span class=\\"token string\\">\\"@/api/index.js\\"</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t<span class=\\"token keyword\\">export</span> <span class=\\"token keyword\\">default</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token function\\">data</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">)</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token keyword\\">return</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token literal-property property\\">userInfo</span><span class=\\"token operator\\">:</span> <span class=\\"token punctuation\\">{</span><span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token literal-property property\\">sexRange</span><span class=\\"token operator\\">:</span> <span class=\\"token punctuation\\">[</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token literal-property property\\">id</span><span class=\\"token operator\\">:</span> <span class=\\"token string\\">'男'</span><span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token literal-property property\\">name</span><span class=\\"token operator\\">:</span> <span class=\\"token string\\">'男'</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">,</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token literal-property property\\">id</span><span class=\\"token operator\\">:</span> <span class=\\"token string\\">'女'</span><span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token literal-property property\\">name</span><span class=\\"token operator\\">:</span> <span class=\\"token string\\">'女'</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">]</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token function\\">onLoad</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">)</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token keyword\\">this</span><span class=\\"token punctuation\\">.</span><span class=\\"token function\\">getInfo</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token literal-property property\\">methods</span><span class=\\"token operator\\">:</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token function\\">getname</span><span class=\\"token punctuation\\">(</span><span class=\\"token parameter\\">e</span><span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token keyword\\">this</span><span class=\\"token punctuation\\">.</span>userInfo<span class=\\"token punctuation\\">.</span>username <span class=\\"token operator\\">=</span> e<span class=\\"token punctuation\\">.</span>detail<span class=\\"token punctuation\\">.</span>value<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token function\\">chooseavatar</span><span class=\\"token punctuation\\">(</span><span class=\\"token parameter\\">e</span><span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token keyword\\">let</span> that <span class=\\"token operator\\">=</span> <span class=\\"token keyword\\">this</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\tconsole<span class=\\"token punctuation\\">.</span><span class=\\"token function\\">log</span><span class=\\"token punctuation\\">(</span><span class=\\"token string\\">'event'</span><span class=\\"token punctuation\\">,</span>e<span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token function\\">upload</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token literal-property property\\">filePath</span><span class=\\"token operator\\">:</span> e<span class=\\"token punctuation\\">.</span>detail<span class=\\"token punctuation\\">.</span>avatarUrl<span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">.</span><span class=\\"token function\\">then</span><span class=\\"token punctuation\\">(</span><span class=\\"token parameter\\">ras</span><span class=\\"token operator\\">=></span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\tthat<span class=\\"token punctuation\\">.</span>userInfo<span class=\\"token punctuation\\">.</span>headimg <span class=\\"token operator\\">=</span> ras<span class=\\"token punctuation\\">.</span>info<span class=\\"token punctuation\\">.</span>url<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">)</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t</span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token function\\">submit</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token function\\">update</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token literal-property property\\">data</span><span class=\\"token operator\\">:</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t\\t<span class=\\"token literal-property property\\">headimg</span><span class=\\"token operator\\">:</span><span class=\\"token keyword\\">this</span><span class=\\"token punctuation\\">.</span>userInfo<span class=\\"token punctuation\\">.</span>headimg<span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t\\t<span class=\\"token literal-property property\\">username</span><span class=\\"token operator\\">:</span><span class=\\"token keyword\\">this</span><span class=\\"token punctuation\\">.</span>userInfo<span class=\\"token punctuation\\">.</span>username<span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">.</span><span class=\\"token function\\">then</span><span class=\\"token punctuation\\">(</span><span class=\\"token parameter\\">res</span><span class=\\"token operator\\">=></span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token keyword\\">if</span><span class=\\"token punctuation\\">(</span>res<span class=\\"token punctuation\\">.</span>code <span class=\\"token operator\\">==</span> <span class=\\"token number\\">1</span><span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t\\tuni<span class=\\"token punctuation\\">.</span><span class=\\"token function\\">showToast</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t\\t\\t<span class=\\"token literal-property property\\">title</span><span class=\\"token operator\\">:</span><span class=\\"token string\\">'保存成功'</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t\\t<span class=\\"token function\\">setTimeout</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">)</span><span class=\\"token operator\\">=></span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t\\t\\tuni<span class=\\"token punctuation\\">.</span><span class=\\"token function\\">navigateBack</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t\\t\\t\\t</span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">)</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">)</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">)</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t\\t</span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token function\\">sexChange</span><span class=\\"token punctuation\\">(</span><span class=\\"token parameter\\">e</span><span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token keyword\\">this</span><span class=\\"token punctuation\\">.</span>userInfo<span class=\\"token punctuation\\">.</span>base_sex <span class=\\"token operator\\">=</span> <span class=\\"token keyword\\">this</span><span class=\\"token punctuation\\">.</span>sexRange<span class=\\"token punctuation\\">[</span>e<span class=\\"token punctuation\\">.</span>detail<span class=\\"token punctuation\\">.</span>value<span class=\\"token punctuation\\">]</span><span class=\\"token punctuation\\">.</span>name<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token function\\">getInfo</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">)</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token function\\">getInfo</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token literal-property property\\">data</span><span class=\\"token operator\\">:</span> <span class=\\"token punctuation\\">{</span><span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">.</span><span class=\\"token function\\">then</span><span class=\\"token punctuation\\">(</span><span class=\\"token parameter\\">res</span> <span class=\\"token operator\\">=></span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token keyword\\">this</span><span class=\\"token punctuation\\">.</span>userInfo <span class=\\"token operator\\">=</span> res<span class=\\"token punctuation\\">.</span>data<span class=\\"token punctuation\\">.</span>user<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">)</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token function\\">goAddress</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">)</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\tuni<span class=\\"token punctuation\\">.</span><span class=\\"token function\\">navigateTo</span><span class=\\"token punctuation\\">(</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token literal-property property\\">url</span><span class=\\"token operator\\">:</span> <span class=\\"token string\\">'/pages/me/address-list'</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">)</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token punctuation\\">}</span><span class=\\"token punctuation\\">,</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\">\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\"></span></span><span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>script</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\"></span>\\n<span class=\\"line\\"><span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"><</span>style</span> <span class=\\"token attr-name\\">lang</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>scss<span class=\\"token punctuation\\">\\"</span></span><span class=\\"token punctuation\\">></span></span><span class=\\"token style\\"><span class=\\"token language-css\\"></span>\\n<span class=\\"line\\">\\t<span class=\\"token selector\\">.card</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">margin-top</span><span class=\\"token punctuation\\">:</span> 10upx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">background</span><span class=\\"token punctuation\\">:</span> <span class=\\"token function\\">rgba</span><span class=\\"token punctuation\\">(</span>255<span class=\\"token punctuation\\">,</span> 255<span class=\\"token punctuation\\">,</span> 255<span class=\\"token punctuation\\">,</span> 1<span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">padding</span><span class=\\"token punctuation\\">:</span> 0 30upx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\"></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token selector\\">.item</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token property\\">border-bottom</span><span class=\\"token punctuation\\">:</span> 1px solid <span class=\\"token function\\">rgba</span><span class=\\"token punctuation\\">(</span>229<span class=\\"token punctuation\\">,</span> 229<span class=\\"token punctuation\\">,</span> 229<span class=\\"token punctuation\\">,</span> 1<span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token property\\">height</span><span class=\\"token punctuation\\">:</span> 100upx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\"></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token selector\\">&:last-child</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">border</span><span class=\\"token punctuation\\">:</span> none<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\"></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token selector\\">.label</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">color</span><span class=\\"token punctuation\\">:</span> <span class=\\"token function\\">rgba</span><span class=\\"token punctuation\\">(</span>0<span class=\\"token punctuation\\">,</span> 0<span class=\\"token punctuation\\">,</span> 0<span class=\\"token punctuation\\">,</span> 1<span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">font-size</span><span class=\\"token punctuation\\">:</span> 30rpx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\"></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token selector\\">.value</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">color</span><span class=\\"token punctuation\\">:</span> <span class=\\"token function\\">rgba</span><span class=\\"token punctuation\\">(</span>128<span class=\\"token punctuation\\">,</span> 128<span class=\\"token punctuation\\">,</span> 128<span class=\\"token punctuation\\">,</span> 1<span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">font-size</span><span class=\\"token punctuation\\">:</span> 28rpx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">text-align</span><span class=\\"token punctuation\\">:</span> right<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\"></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token selector\\">span</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">display</span><span class=\\"token punctuation\\">:</span> block<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">font-size</span><span class=\\"token punctuation\\">:</span> 36upx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">margin-left</span><span class=\\"token punctuation\\">:</span> 16upx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">transform</span><span class=\\"token punctuation\\">:</span> <span class=\\"token function\\">scaleX</span><span class=\\"token punctuation\\">(</span>0.5<span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\"></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token selector\\">.avatar</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">width</span><span class=\\"token punctuation\\">:</span> 70rpx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">height</span><span class=\\"token punctuation\\">:</span> 70rpx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">border-radius</span><span class=\\"token punctuation\\">:</span> 50%<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">margin</span><span class=\\"token punctuation\\">:</span> 0<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">padding</span><span class=\\"token punctuation\\">:</span> 0<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token property\\">background</span><span class=\\"token punctuation\\">:</span> none<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token selector\\">&::after</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token property\\">border</span><span class=\\"token punctuation\\">:</span> none<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token selector\\">image</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token property\\">width</span><span class=\\"token punctuation\\">:</span> 70upx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token property\\">height</span><span class=\\"token punctuation\\">:</span> 70upx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t\\t<span class=\\"token property\\">border-radius</span><span class=\\"token punctuation\\">:</span> 50%<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t\\t\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\">\\t\\t\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\">\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\"></span>\\n<span class=\\"line\\">\\t<span class=\\"token selector\\">page</span> <span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">background</span><span class=\\"token punctuation\\">:</span> <span class=\\"token function\\">rgba</span><span class=\\"token punctuation\\">(</span>247<span class=\\"token punctuation\\">,</span> 247<span class=\\"token punctuation\\">,</span> 250<span class=\\"token punctuation\\">,</span> 1<span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\">\\t<span class=\\"token selector\\">.options</span><span class=\\"token punctuation\\">{</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">width</span><span class=\\"token punctuation\\">:</span> 690rpx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">height</span><span class=\\"token punctuation\\">:</span> 94rpx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">background</span><span class=\\"token punctuation\\">:</span> <span class=\\"token function\\">rgba</span><span class=\\"token punctuation\\">(</span>58<span class=\\"token punctuation\\">,</span> 131<span class=\\"token punctuation\\">,</span> 251<span class=\\"token punctuation\\">,</span> 1<span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">border-radius</span><span class=\\"token punctuation\\">:</span> 50rpx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">color</span><span class=\\"token punctuation\\">:</span> <span class=\\"token function\\">rgba</span><span class=\\"token punctuation\\">(</span>255<span class=\\"token punctuation\\">,</span> 255<span class=\\"token punctuation\\">,</span> 255<span class=\\"token punctuation\\">,</span> 1<span class=\\"token punctuation\\">)</span><span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">font-size</span><span class=\\"token punctuation\\">:</span> 36rpx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">line-height</span><span class=\\"token punctuation\\">:</span> 36rpx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">position</span><span class=\\"token punctuation\\">:</span> fixed<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">bottom</span><span class=\\"token punctuation\\">:</span> 50upx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t\\t<span class=\\"token property\\">left</span><span class=\\"token punctuation\\">:</span> 30upx<span class=\\"token punctuation\\">;</span></span>\\n<span class=\\"line\\">\\t<span class=\\"token punctuation\\">}</span></span>\\n<span class=\\"line\\"></span></span><span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\"></</span>style</span><span class=\\"token punctuation\\">></span></span></span>\\n<span class=\\"line\\"></span>\\n<span class=\\"line\\"></span></code></pre></div>"}`);export{k as comp,r as data};