userAvatarUrl不支持圆形效果?
发布于 6 年前 作者 qiang46 10646 次浏览 来自 问答

最近wx.getUserInfo接口即将下线,我打算改成open-data的方式,但发现采用之后,原来的头像圆形效果怎么也出不来,代码如下:

<view class=“img_radius”><open-data type=“userAvatarUrl”></open-data></view>

.img_radius{

width: 100rpx;

height: 100rpx;

border-radius: 100rpx;

}

之前用的这种方式:

<image src="{{headImg}}" class=“img_radius”></image>

头像就是圆形的。

看看怎么弄才能兼容原来的设计呢?

7 回复

加个overflow:hidden试试

clip-path: circle(50% at center);

这个好使,谢了!

是的,它是显示给自己看的,所以不用授权,sdkversion>1.9.90才可以

请问<open-data type=“userAvatarUrl”></open-data>  这样直接使用就可以了嘛?不用调任何API或者先置条件?为什么我的按照open-data文档那里的片段代码照搬什么也不显示

比较保险的做法就是套一层div overflow:hidden;   真心不知道这次的升级高明在哪里?bug好多  ,我的测试工具一直有个垂直的pc端样式的滚动条

overflow: hidden;

经测试有效,其他人可以参考。

样式里面加clip-path(50rpx at center)试试???

回到顶部