微信小程序——受權

時間 2019-11-26

標籤微信程序受權简体版

原文原文鏈接

標籤：小程序受權html

需求

進入小程序首頁，用戶點擊頁面任意地方觸發小程序受權彈窗，若是已受權則不觸發彈窗前端

實現難點

小程序的wx.getUserInfo()接口不會主動觸發小程序受權彈窗，只能經過button組件的open-type ，經過點擊觸發受權彈窗；
受權以後，再次點擊頁面進行正常的操做邏輯

思路分析

分析解決問題的思路 1.思路一是經過父組件button包裹頁面內容，觸發受權彈窗，但該思路致使一個問題：用戶贊成受權以後，再次點頁面會繼續執行button的點擊事件，觸發wx.getUserInfo()接口，不能進行正常的業務邏輯 2.改變1中的思路，將button組件做爲一個蒙層，經過受權與否判斷是否渲染該蒙層web

代碼實現

<html>
<view class="city-wrap flex-box fw-wr" hover-class="none" hover-stop-propagation="true">
    <block wx:for="{{cityList}}" wx:key="{{item.areaId}}" >
        <view class="fd-col" data-city="{{item.areaId}}" data-name="{{item.name}}" catchtap="handleSelectCity">
            <image class="city-pic-wrap" src="{{item.citySelectedFlag ? cityWrapSelected : cityWrap }}">
                <image class="city-pic" src="{{item.picture}}"/>
            </image>
            <view class="city">{{item.name}}</view>
            <view class="city">{{item.spell}}</view>
        </view>
    </block>
</view>
<view class="lookfoward-more flex-b-cc">
    <text>更多城市正在探索，敬請期待</text>
</view>
<button open-type="getUserInfo" class="wechat-auth-wrap" bindgetuserinfo="handleLogin" wx:if="{{!userAuthorization}}">
</button>
</html>
複製代碼