微信小程序

官方文档：developers.weixin.qq.com/miniprogram…

怎么引用svg图标：blog.csdn.net/tao_meng_/a…

矢量图：www.iconfont.cn/home/index

长按保存图片：www.cnblogs.com/moranjl/p/1…

弹窗：

wxml:

<view class="mask" wx:if="{{showUserDetailModalVisible}}" bindtap="hideModal"></view>
<view class="userDetailModal" wx:if="{{showUserDetailModalVisible}}">
  弹窗内容
 </view>

wxss:

.mask{
 width: 100%;
 height: 100%;
 position: fixed;
 top: 0;
 left: 0;
 background: #000;
 opacity: 0.2;
 overflow: hidden;
 z-index: 1000;
 color: #fff;
}

.userDetailModal{
 width: 100%;
 height: 40%;
 overflow: hidden;
 position: fixed;
 bottom: 0;
 left: 0;
 z-index: 2000;
 background: #fff;
 padding-top: 1rpx;
 border-radius: 20rpx 0;
}

js：

data:{
  showUserDetailModalVisible: false
},
showUserDetail: function () {
   this.setData({
     showUserDetailModalVisible:true
   })
 },
hideModal:function(){
   this.setData({
     showUserDetailModalVisible:false
   })
 }