Taro开发微信小程序-用户授权(三)

我们已经完成了用户的登录，现在我们来完成用户的授权页面。

我们要先在src/app.js中，查看用户授权了没有，如果用户授权的话不需要再次确认授权。 写在componentWillMount生命周期中：

Taro.getSetting()
      .then(res=>{
        if(res.authSetting["scope.userInfo"]){
          return true;
        }else {
          throw new Error(没有授权)
        }
      })
      .then(res=>{
        return Taro.getUserInfo();
      })
      .then(res=>{
        Taro.setStorage({
          key: userInfo,
          data: res.userInfo
        })
      })
      .catch(err=>{
        console.log(err)
      })

用户授权的话，把用户的详细信息保存在Storage中的userInfo中 。 我们可以写一个主页，src/pages/index/index.js，如果用户没有授权，页面出一个按钮点击后询问授权，如果用户已经授权的话直接跳转。

componentDidMount(){
    try {
      const value = Taro.getStorageSync(userInfo)
      if (value) {
        Taro.redirectTo({
          url: /pages/main/index
        })
      }
    } catch (e) {
      // Do something when catch error
    }    
}

tobegin = () => {
    Taro.redirectTo({
      url: /pages/main/index
    })
  };

<Button
    openType=getUserInfo
    onGetUserInfo{this.tobegin}
>
    用户授权
</Button>

import Taro, { Component } from @tarojs/taro
import { View, Button } from @tarojs/components

import ./index.less


class Index extends Component {

    config = {
    navigationBarTitleText: 首页
  }

  tobegin = () => {
    Taro.redirectTo({
      url: /pages/main/index
    })
  };

  componentDidMount(){
    try {
      const value = Taro.getStorageSync(userInfo)
      if (value) {
        Taro.redirectTo({
          url: /pages/main/index
        })
      }
    } catch (e) {
      // Do something when catch error
    }
    
  }

  render () {
    return (
      <View className=index>
        <Button className=btn openType=getUserInfo onGetUserInfo={this.tobegin} type=primary lang=zh_CN>
            开启缘分
        </Button>
      </View>
    )
  }
}

export default Index