微信小程序实战教程，适合初学者快速入门。

项目预览

这是完成该微信小程序后的部分截图

关于该课程

3个月前，9月初进入某公司实习，要接手开发公司的微信小程序，对于从未接触过微信小程序的菜鸟我来说，要快速上手，就得找个实战项目练习。
于是利用业余时间找到了这个课程，学习了从0创建开发账号到部署上线的整个过程。对微信小程序开发豁然开朗。学过VUE的同学，上手是很快的。
有需要的人可以去学习哦，这是某马培训的，讲的挺好，很适合初学者。
B站视频，放心点击。
课程视频地址：点我直达
接口文档地址：点我直达

收获到的知识

1. 组件封装
   小程序同VUE类框架一样，也有组件概念，练习了复用组件，再次巩固了封装组件的思维。
2. 缓存Storage
   都是微信小程序提供的原生api
   异步缓存
   wx.setStorage(Object object)
wx.getStorage(Object object)
wx.removeStorage(Object object)
   同步缓存
   wx.setStorageSync(string key, any data)
Object wx.getStorageInfoSync()
wx.removeStorageSync(string key)
3. 组件
   微信小程序提供了很多组件，如轮播图、scroll-view、rich-text、picker等
   极大方便了开发过程
4. 防抖和节流
   再项目中遇到了搜索商品事件，每输入一个字母都要请求服务器，为减少这种频率，就要用到节流防抖

• 防抖
  网上好多又是封装又是return的写一堆，摒弃优雅的写法，写一下跟我一样的小白容易理解的写法，哈哈
  **定义：**某一事件频繁触发，仅最后一次触发的事件生效。
  对比代码，大白话讲解：定义timer计时，监听input的输入事件，计时器开启之前又重置了计时器。当第一次敲击键盘，到达计时器任务时会延迟1秒，倘若第二次距离第一次敲击键盘事件小于1秒，则会清除第一次的计时器，重新计时，以此达到减少频率的效果，仅最后一次触发有效。

<input type="text">

  let timer
  let input = document.querySelector('input')
  input.addEventListener('input', () => {
    clearTimeout(timer)
    timer = setTimeout(() => {
      console.log(input.value)
      //下面是执行请求服务器的过程
    }, 1000);
  })

• 节流
  节流是指定时间内触发一次，有频率的进行事件触发。
  利用闭包的机制，保存一个标志，来判断是否要触发某个函数

  let input = document.querySelector('input')
    input.oninput= throttle(()=>{
      console.log(input.value);
    },1000)
    //下面是执行请求服务器的过程
  function throttle(fn, delay) {
    let valid = true
    return function () {
      if (!valid) {
        return 
      }
      valid = false
      setTimeout(() => {
        fn()
        valid = true
      }, delay);
    }
  }

5. vant组件库
   Vant 是有赞前端团队开源的移动端组件库，于 2016 年开源，已持续维护 4 年时间。Vant 对内承载了有赞所有核心业务，对外服务十多万开发者，是业界主流的移动端组件库之一。
   组件库地址：点我直达
6. 页面间传值
   跳转其他页面时，可以附带需要传入的参数。跟get传参是一样的，直接在连接后跟参数即可
   如：?name=yuanxiaoshen&sex=boy
   在另一个页面的onload(option)事件的option即可拿到传过来的值。

---

个人博客：https://yuanxiaoshen.com
欢迎留下足迹。