评论

SAUI改版

saui(首页改版,仿携程酒店列表,仿app store的功能优化)

这次的更新:

  1. 首页改版(提供两种风格,可点击底部的风格按钮进行切换)
onChangeStyle: function(e, params, inst) {
    const $indexSwiper = this.getElementsById('indexSwiper')  //找到实例
    if(params.cur == 0){
      $indexSwiper.update({'$list.type': {is: 'swiper', circular: false, duration: 300, 'indicator-dots': true, current: 0}, '$list.listClass': 'swiper', '$list.data': indexSwiperData('block')})
      //--color是css的变量,这里icon的content需要像以下的写法才能正常显示。这是首页改版的唯一难点,试了半天
      inst.update({'tap': 'onChangeStyle?cur=1', itemStyle: '--color: #2567FF; --icon: "\\e83e"'})
    }
    else{
     // 通过参数判断 重置为初始值
      $indexSwiper.reset()
      inst.reset()
    }
  }
update的时候,去修改适配的方法,通过方法去改变页面的结构

2.仿携程酒店列表的完整版本

筛选部分,我做了好几天,好几个版本。因为组件与组件的嵌套,父级组件会影响子级组件。

3.仿app store的优化

修复了appstore的列表页面,之前展开详情后滚动的位置不对。而且提供了两种数据方式,一种云数据库的请求,一种本地模拟数据


这次更新后,可能后面的精力更多的放在优化上。当然 也不排除突然看到什么东西想做的。不过优化会是我一直下去的方向


默认风格:

轮播风格:


仿携程酒店列表:(这个的重点,难点在于筛选部分)


仿app Store的功能优化:



项目正在等待审核,预计明天能审核通过。有兴趣的童鞋可以搜索SAUI或者扫以下的二维码关注我的小程序


最后一次编辑于  03-24  
点赞 1
收藏
评论

1 个评论

  • Cooper
    Cooper
    03-24

    ui好看

    03-24
    赞同
    回复 1
    • 🌙
      🌙
      03-24
      哈 谢谢~~~
      03-24
      1
      回复
登录 后发表内容