uni-app 实现微信授权登录

最近在写网易云音乐微信小程序，发现项目中少了点什么东西，于是爆肝了几天，参考了很多网上的写法，最终实现了这个简单的登录功能！

注意，微信小程序是没有登出功能的，害的我找了半天的api，在平时的是使用中，退出小程序直接点右上角的小圆点，只要你第一次授权登录了，下次登录基本会记住你的头像信息，当然也不排除一些很蛋疼的小程序，每次都要重复授权！！

话不多说，请看代码

index.vue

<template>
	<view class="index">
		<musichead title="网易云音乐" :icon="false"></musichead>
		<view class="container">
			<scroll-view scroll-y="true">
				<!--登录-->
				<view class="index-login">
					<view class="index-login-left">
						<image class="index-login-left-img" :src="userInfo.avatarUrl"></image>
					</view>
					<text class="idnex-login-text">{{ userInfo.nickName ||  '未登录' }}</text>
					<!--#ifdef MP-WEIXIN-->	
						<button type="sumbit" plain="true" size="mini" open-type="getUserInfo" @tap="login" @click="change" >{{ logState }}</button>
					<!--#endif-->
				</view>
			</scroll-view>
		</view>
	</view>
</template>
<script>
	// 引入css
	import '../../common/iconfont.css'
	// 引入接口
	import { topList } from '../../common/api.js'
	export default {
		data() {
			return {
				topList : [],
				userInfo : {},
				logState : '立即登录',
			};
		},
		onLoad(){ }，
		methods: {
			// 登录部分
			login(){
				// 获取code 小程序专有，用户登录凭证。
				uni.getUserProfile({
					desc: "获取用户基本资料",
					success : (res)=>{
						this.userInfo = res.userInfo;
					},
					// 用户取消登录后的提示
					fail: (res)=>{
						uni.showModal({
							title:"授权用户信息失败！",
							// 是否显示取消按钮，默认为 true
							showCancel:false
						})
					}
				})
				//获取成功基本资料后开启登录，基本资料首先要授权
				uni.login({
					provider : 'weixin',
					success : (res)=>{
						console.log(res);
						if(res.errMsg == "login:ok"){
							let code =res.code;
						}
					}
				})
			},
			// 退出登录
			change(){
				// 这里只是改变了按钮文字内容，真正退出需要清除token，回到首页,还没找到头绪怎么做
				this.logState = '已登录';
			}
		}
</script>
<style>
	/*登录*/
	.index-login{ margin: auto; width:379px; }
	.index-login-left{ width:35px; height:35px;  position: absolute; overflow: hidden; background: url(../../static/user.png); }
	.index-login-left-img{ width:35px; height:35px;  border-radius: 50%; }
	.index-login-img-text{ font-size:34px; color:#dddddd; }
	.idnex-login-text{ font-size:14px; vertical-align: sub; margin-left: 45px; color:#888; }
	.index-login button{ float:right; border:1px #dddddd solid; border-radius: 30px; }
</style>