<view wx:if="{{isHide}}">

<view wx:if="{{canIUse}}" >

<view class=‘header’>

<image src=’/images/logo.jpg’></image>

</view>

<text class=“title”>test</text>

<button class=‘bottom’ type=‘primary’ open-type=“getUserInfo” lang=“zh_CN” bindgetuserinfo=“bindGetUserInfo”>

授权获取头像和昵称

</button>

</view>

<view wx:else>请升级微信版本</view>

</view>

<view wx:else>

</view>

/**index.wxss**/

.header {

margin: 90rpx 0rpx 0rpx 50rpx;

text-align: center;

width: 650rpx;

height: 260rpx;

}

.header image {

width: 260rpx;

height: 260rpx;

border-radius: 130rpx;

}

.title {

display: flex;

margin-top: 30rpx;

justify-content: center;

font-weight: lighter;

font-size: 35rpx;

}

.bottom {

display: flex;

align-items:center;

justify-content: center;

margin-top: 200rpx;

width: 90%;

border-radius: 10rpx;

font-weight: normal;

font-size: 30rpx;

line-height: 50rpx;

}

不知道为什么这么写 按钮宽度为啥控制不了呢  mate9上测试的。