微信小程序笔记

最新推荐文章于 2023-02-23 11:10:26 发布

原创最新推荐文章于 2023-02-23 11:10:26 发布 · 215 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#微信小程序

微信小程序专栏收录该内容

1 篇文章

订阅专栏

本文深入探讨了小程序开发中常用的技术点，包括元素输入的获取与处理，数据类型的过滤操作，以及页面跳转来源的判断方法。同时，还介绍了如何通过CSS定制分享按钮和客服按钮的样式，为用户提供更佳的交互体验。

元素

input

 // 获取输入框的内容，封装起来，根据data-的值去渲染不同的data
bindKeyInput: function (e) {
　　let inputName = e.currentTarget.dataset.inputname;
　　this.setData({
　　　　[inputName]: e.detail.value
　　})
},

数据类型

Array

 // filter
 let childrens = childrens.filter (function (c) {
   return c.name.indexOf(key)>0;
    });

页面

判断页面跳转来源

onLoad: function (options) {
    let pages = getCurrentPages();
    let prevpage = pages[pages.length - 2];
    console.log(prevpage.route)
  },

样式

取消分享按钮边框

.button_share::after{
  border:0;
}

客服按钮

    .contact {
      background-color:#fff;
      width: 100%;
      height: 60rpx;
      line-height: 60rpx;
      margin:0;
      padding:0;
      border:0;
      border-radius:0;
    }
    .contact::after{
      border:0;
      border-radius:0;
    }

<button open-type="contact" class="contact">
   <view class="doc">客服</view>
 </button>