微信小程序底部弹框 showActionSheet

迈不过友情╰ 2023-10-07 17:28 7阅读 0赞

> 志在巅峰的攀登者，不会陶醉在沿途的某个脚印之中，在码农的世界里，优美的应用体验，来源于程序员对细节的处理以及自我要求的境界，年轻人也是忙忙碌碌的码农中一员，每天、每周，都会留下一些脚印，就是这些创作的内容，有一种执着，就是不知为什么，如果你迷茫，不妨来瞅瞅码农的轨迹。

如果你有兴趣 你可以关注一下公众号 biglead 来获取最新的学习资料。

--------------------

效果预览  
![在这里插入图片描述][0aea11cf884d4384b5c9521e497eda9a.gif_pic_center]

##### 1 在wxml中，只是设置了个点击事件 #####

大家知道的，这是创建的默认的微信小程序项目中的 Hello World

<view class="usermotto">
        <text class="user-motto" bindtap="openActionsheet">{
        {
        motto}}</text>
      </view>

##### 2 对应的 js 文件 #####

openActionsheet(e){
        
        wx.showActionSheet({
        
          itemList: ['回复','转发','打印'],
          itemColor: '#007aff',
          success(res) {
        
            if(res.tapIndex === 0){
        
              wx.showToast({
         title: '回复成功！' });
            }else if(res.tapIndex === 1){
        
              wx.showToast({
         title: '转发成功！' });
            }else if(res.tapIndex === 2){
        
              wx.showToast({
         title: '打印成功！' });
            }
          }
        })
      }

小编在Flutter领域有不少积累，如果你有兴趣可以来看看

*  [Flutter 从入门 到精通系列文章在这里][Flutter _]

小编也写了几本书，如果你有兴趣可以去看看

*  [手机点击查看][Link 1] \# [电脑点击查看][Link 2]  
    ![请添加图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5pep6LW355qE5bm06L275Lq6_size_20_color_FFFFFF_t_70_g_se_x_16]

--------------------

*  [手机点击查看][Link 3] \# [电脑点击查看][Link 4]

![在这里插入图片描述][watermark_type_d3F5LXplbmhlaQ_shadow_50_text_Q1NETiBA5pep6LW355qE5bm06L275Lq6_size_20_color_FFFFFF_t_70_g_se_x_16_pic_center]

[0aea11cf884d4384b5c9521e497eda9a.gif_pic_center]: https://img-blog.csdnimg.cn/0aea11cf884d4384b5c9521e497eda9a.gif#pic_center
[Flutter _]: https://blog.csdn.net/zl18603543572/article/details/93532582
[Link 1]: https://m.tb.cn/h.f6IsZcl?sm=b5555a
[Link 2]: https://detail.tmall.com/item.htm?id=658886049139
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5pep6LW355qE5bm06L275Lq6_size_20_color_FFFFFF_t_70_g_se_x_16]: https://img-blog.csdnimg.cn/ed9ecf4aacc84e5cb17d5b486e431083.jpg?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5pep6LW355qE5bm06L275Lq6,size_20,color_FFFFFF,t_70,g_se,x_16
[Link 3]: https://item.m.jd.com/product/10040957873690.html?&utm_source=iosapp&utm_medium=appshare&utm_campaign=t_335139774&utm_term=CopyURL&ad_od=share&utm_user=plusmember&gx=RnFjxjUIbWGNztQUp4J3XrJgfXzlaNZ0
[Link 4]: https://item.jd.com/13009851.html
[watermark_type_d3F5LXplbmhlaQ_shadow_50_text_Q1NETiBA5pep6LW355qE5bm06L275Lq6_size_20_color_FFFFFF_t_70_g_se_x_16_pic_center]: https://img-blog.csdnimg.cn/0b0016200df2484aa2029c1b20224fee.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA5pep6LW355qE5bm06L275Lq6,size_20,color_FFFFFF,t_70,g_se,x_16#pic_center