微信小程序
满舰饰v
var obj = new Object();
展开
-
原生微信小程序,楼层跳转,scroll-into-view,实例+遇到的坑
原生微信小程序,楼层跳转,scroll-into-view,实例+遇到的坑先看一下演示效果需要注意的几个踩坑点1 . scroll-view 必须设置 scroll-y="true" 或者 scroll-x="true"看你想往哪个方向滚动2 . scroll-into-view=" {{toViewId}} " 的值,必须是动态的,不能是写死的,一般也不应该出现写死的情况(且值应为某子元素的 id( id不能以数字开头 ))3 . 还是和上面一样,scroll-into-view=" {{t原创 2020-09-10 17:38:29 · 1240 阅读 · 1 评论 -
原生微信小程序,navigate(导航栏)tab栏,tab栏与swiper结合,含过渡动画,初级
原生微信小程序,navigate(导航栏)tab栏,tab栏与swiper结合,含过渡动画,初级看一下演示效果之前也做过一个类似的,tab(navigator) 栏,但是 tab 标签下面的小横线没有过渡效果,看起来会很生硬,而且不是和 swiper 联动,总体效果不尽人意,这是一个改进版之前的 tab 栏切换效果演示,用来做学习的话还是很不错的,感兴趣的可以点这里跳转->旧版(学习版)地址看一下代码吧,实现起来比较简单,也比较初级.wxml<!-- tab --><原创 2020-09-10 11:23:27 · 1070 阅读 · 1 评论 -
原生微信小程序 动态(横向,纵向)公告(广告)栏
原生微信小程序 动态(横向,纵向)公告(广告)栏先看一下动态效果Y轴滚动公告的原理是swiper组件在页面中的Y轴滚动,属性vertical,其余属性也设置一下autoplay circular interval="3000"X轴滚动的原理是,利用动画效果,将内容从右往左过渡过去看下代码.wxss<!-- Y轴滚动公告 --><view class="wrapY"> <swiper class="swiper_wrap" vertical原创 2020-09-08 15:50:28 · 3453 阅读 · 2 评论 -
原生微信小程序,实现 下拉菜单 ,带遮罩层,出现隐藏动画(dropDownMenu思路总结)
原生微信小程序,实现 下拉菜单 ,带遮罩层,出现隐藏动画(dropDownMenu思路总结)实现效果先上代码,下面开始做总结.wxml 代码<!-- 导航栏循环 --><view class="wrap"> <view data-id="{{item.id}}" bind:tap="handleClick" wx:for="{{navItem}}" class="item {{item.isActive?'active':''}}" >原创 2020-09-08 11:11:00 · 4564 阅读 · 2 评论 -
原生微信小程序实现 “上拉刷新” 和 “下拉加载” 的原理
原生微信小程序实现 “上拉刷新” 和 “下拉加载” 的原理上滑加载更多在使用上滑加载更多时,有一个小坑需要注意下,如果是自定义的scroll-view,滑到底是没法触发onReachBottom函数的需要在scroll-view组件上定义lower-threshold="50"属性(距底部/右边多远(50)时,触发 scrolltolower 事件)然后bindscrolltolower = “自定义函数名”,把需要执行的逻辑放在这里面执行,假装他是onReachBottom函数实现上滑加载更多原创 2020-09-03 15:59:24 · 1231 阅读 · 0 评论 -
原生微信小程序,scroll-view的使用,一屏两个滚动区域,scroll-y(纵向滚动)
原生微信小程序,scroll-view的使用,一屏两个滚动区域,scroll-y(纵向滚动)这个会简单很多结构层<view class="container"> <!-- scroll-view标签在使用时,可以当做普通的view标签使用,可以设置很多属性改变XY轴滚动 --> <!-- 左侧滚动栏 --> <!-- view{$}*100可以一次打印1-100内容的view标签 --> <scroll-view scroll-y原创 2020-09-01 15:19:34 · 5177 阅读 · 3 评论