微信小程序开发实战:两大技巧分享

2018/6/4 22:24:22 766 15
摘要: 关于微信小程序如何开发的问题,其实要真正细说的话,需要很长的篇幅。下面我们挑选其中的两个开发内容进行分析,

关于微信小程序如何开发的问题,其实要真正细说的话,需要很长的篇幅。下面我们挑选其中的两个开发内容进行分析,跟大家分享一下小程序开发过程中的锚点以及滚动加载的开发技巧。

 

1、锚点

以往内<navigator>的url只能是app。json里配置的路由,它只支持查询字符串,不支持hash,所以不能通过链接做锚点。但是,微信平台提供了<scroll-view>,可以利用它来做微信小程序开发锚点,具体实现如下:

 

wxml文件

 

    <view>

        <button data-hash="hash1" bindtap="goHash">点击定向hash1</button>

        <button data-hash="hash2" bindtap="goHash">点击定向hash2</button>

    </view>

    <scroll-view scroll-y="true" scroll-into-view="{{toView}}">

        <view id="hash1"></view>

        <view id="hash2"></view>

    </scroll-view>

 

js文件

 

    Page({

        data: {

            toView: 'hash1'

        },

        goHash (e) {

            let hash = e.currentTarget.dataset.hash

            this.setData({

                toView: hash

            })

        }

    })

 

不过,值得注意的是,这种方式下实现的,只能点击按钮,跳转锚点,屏幕滑动到相应锚点,toView属性不会相应改变。

 

2滚动加载

微信没有document、window对象,因此在开发小程序时也无法使用onscroll,只能借助微信提供的<scroll-view>,去实现滚动加载。实现如下:

 

wxml文件

 

    <scroll-view scroll-y="true" scroll-into-view="{{toView}}" bindscrolltolower=loadMovies>

        <view wx:for="{{movies}}" wx:key="index">

            {{item.name}}

        </view>

    </scroll-view>

 

js文件

 

    Page({

        data: {

            movies: []

        },

        getMovies () {

            let _self = this

            wx。request({

              url: 'https://。。。。。。',

              data: {},

              success: function(res) {

                // res。data才是你后端返回的真实数据

                _self.setData({

                    movies: res。data

                })

              }

            })

        },

        loadMovies () {

            // 得到要更新的数据,setData重置movies

        }

    })

 

  


声明:文章"微信小程序开发实战:两大技巧分享"为互诚科技—微信小程序开发公司的原创文章,转载请注明出处,谢谢合作!
标签:小程序商城
电话咨询:18011971195(黄先生)
在线留言:
微信扫码,关注我们
相关文章
  • 微信小程序开发要准备什么资料

    企业商家在准备开发微信小程序的时候,需要针对小程序的申请流程与开发流程,去准备一些必须的资料

  • 谈谈微信小程序电商的起步技巧

    电商商家开发微信小程序做电子商城使用,刚开始可能不如第三方大电商平台那样,能为自己的商城争取到很多客户流量。由于电商小程序是独立的商城

  • 利用微信小程序创业需要注意的问题有哪些

    微信小程序的出现,给到很多创业者新的发展方向,让创业者能在移动端的创业与发展有更多的选择空间与发展空间。不过,虽然小程序经过不断的完善与优化,关注度

  • 广州小程序商城开发后,怎样才能快速渗透到消费者群体中?

    用过很多小程序,也在很多小程序商城中消费过,但如果不是自己偶然看到广告、看到活动或者好友分享,其实很难知道有这么

  • 微信小程序商城开发,必须要开发的功能模块有哪些?

    很多行业的企业商家,想要进入到小程序市场中去发展,结合行业的特色后,很多会考虑以小程序商城的形式进入。所以,做微信小程序商城开发

  • 微信小程序开发难不难

    关于微信小程序开发的问,目前还是有些人对它并不是很了解。比如一些企业商家、小程序开发初学者等等,他们对于它开发的门槛、技术、费用等可能会存在疑惑,而因为不了解

最新评论
网友:
发表评论
剩余200/最多输入200
凤凰彩票官网 132彩票官网 双赢彩票 159彩票充值中心 彩都会彩票 满堂彩官网 满堂彩 购乐彩充值中心 优乐彩官网 178彩票官网