全网整合营销服务商

营销型网站+SEO优化+关键词快排=一站式服务

免费咨询热线:15959292472

[重庆seo公司是什么]微信小程序开发常用的方法总结(代码)

  

本篇文章给大家带来的内容是关于微信小程序开发常用的方法总结(代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。[重庆seo公司是什么]

  1●▷□…:wx□○:for=”{{}}”遍历时,要加wx:key=""否则会有警告提示VM120▷=:3 Now you can provide attr “wx:key=◆” for a “wx▼■•=:for●◇” to improve performance.☆◇▷,但页面不会报错

  

2△■★▲:事件方法传参的写法:bindtap=”toDetail▪○▲△” data-data=○…▲”{{item◇★☆☆.url}}”

 

  js▽◆○:

  

toDetail••△…:function(e){
 let url = e.currentTarget.dataset.data;
 wx.navigateTo({
 url: '../bookdetail/detail'◁▷;
 });
 }

3.swiper自定义圆点样式

<view class="◁●;wrap">▲•△-;
 <□▲▲☆;swiper class="swiper_book_img" current="{{currentSwiper}}"★=; bindchange="◆□-•;swiperChange">△▼•▼;
 <•◁◇▷;block wx:for="{{banner}}" wx:key="unique">=▽=◁;
 <swiper-item class="slide_img"◁▼○•;>
 <image src="…◇★◇;{{item.picUrl}}" class="slide-image" width="100%" height="110" ></image>▼-•;
 <◁★;/swiper-item>☆…□■;
 <•▲;/block>△○▷◁;
 <△▼;/swiper>
 <◁=…●;!--重置小圆点的样式 -->□=▪;
 <◁•;view class="dots">▽●; 
 <block wx:for="▪•○;{{banner}}" wx:key="unique"> 
 <view class="dot{{index == currentSwiper ▷□? '▽◆; active' : ''◁△■▲;}}" id="{{index}}"◇△▷◁;></view> 
 <◁◁●;/block> 
 </view>
 </view>
js:data: {
 // tab切换 
 currentSwiper: 0
 },swiperChange: function (e) {
 this◇△.setData({
 currentSwiper▲■◇▼: e.detail□◁▽•.current
 })
}…•-,
wxss■□△△:/*用来包裹所有的小圆点 */
.dots { 
display: flex★•○◇; 
justify-content:center; 
flex-direction•□: row; 
margin:22rpx auto=☆☆•;
}
/*未选中时的小圆点样式 */
.dot { 
width: 10rpx; 
height★=◁: 10rpx••; 
border-radius◁•▪: 50%;
 margin-right: 18rpx▼●; 
 background-color=▪•: #969FA9; 
 opacity=▷: 0.5;
 }
/*选中以后的小圆点样式 */
•●▪□.active { 
width: 20rpx; 
height★▲◇: 10rpx▽○▲-; 
border-radius:20rpx◁•;background-image◆■▲○: linear-gradient(-90deg, rgba(150,159,169▷-▲,0.50) 24%, #F5F7FA 100%)◁•▪;
border-radius◁■: 100px■▽•▲;
}

4.微信小程序获取当前页面的url

 

  使用getCurrentPages可以获取当前加载中所有的页面对象的一个数组,数组最后一个就是当前页面

  

var pages = getCurrentPages() //获取加载的页面
var currentPage = pages[pages…○★.length-1] //获取当前页面的对象
var url = currentPage.route //当前页面url
var options = currentPage.options //如果要获取url中所带的参数可以查看options

 

  可以写成工具函数放到utils中■☆□▪:
 

  

/获取当前页url/ function getCurrentPageUrl(){ 
 var pages = getCurrentPages() //获取加载的页面 
 var currentPage = pages[pages.length-1] //获取当前页面的对象 
 var url = currentPage▲★★■.route //当前页面url 
 return url }
/获取当前页带参数的url/ function getCurrentPageUrlWithArgs(){ 
 var pages = getCurrentPages() //获取加载的页面 
 var currentPage = pages[pages●☆▼.length-1] //获取当前页面的对象 
 var url = currentPage-◆.route //当前页面url 
 var options = currentPage●◆▷.options //如果要获取url中所带的参数可以查看options
//拼接url的参数
var urlWithArgs = url + '▪-□?'
for(var key in options){
 var value = options[key]
 urlWithArgs += key + '▽◆;=' + value + '&'
}
urlWithArgs = urlWithArgs.substring(0, urlWithArgs-•.length-1)
return urlWithArgs
}
module.exports = { 
 getCurrentPageUrl•▷○▽: getCurrentPageUrl▼☆, 
 getCurrentPageUrlWithArgs: getCurrentPageUrlWithArgs }

5.A页面跳转到B页面 标题更新

 

  全局的app.js 中设置参数存放标题
 

  

globalData: { 
 userInfo: null□◆, 
 bookTitle:▽★…▼”●■◆” 
 } A页面跳转方法中设置全局的标题参数 app.globalData.bookTitle =”标题-■”
B页面 onLoad:function(){ 
 wx.setNavigationBarTitle({ 
 title▷▽▽-: app.globalData.bookTitle 
 }) 
 }

6 scroll组件

 

  

<scroll-view scroll-y="▲▽;true" bindscrolltoupper="refresh" bindscrolltolower="loadMore" lower-threshold="50"□☆; bindscroll="scroll">

 

  scroll组件绑定了 bindscroll=”scroll◁…”方法,没定义这个方法时 ,会出现这样的错误提示,揭阳市小程序制作公司但不影响效果,滚动正常,新民市小程序开发哪家好去掉即可

  

7■•.微信小程序 —— button按钮去除border边框

 

  在开发微信小程序组件框架时,我遇到了一个问题,微信小程序中的button组件有特定的css•◁-,背景可以用“background:none”去掉,但是边框再用“border …★●●: none•◇◇”去掉就不可以了,09 2020.10 [泰州seo公司]mysql数据库如何创建数据表 mysql数据库创建数据表的方法是:可以通过CREATE TABLE语句来创建,基本语法:【CREATE TABLE 表名 ([表定义选项])[表选项][分区选项];】。要注意的是,创建数据表不能使用SQL语言中的关键字。这也是微信小程序与h5的不同之处。
但是在微信小程序中使用:after选择器就可以实现这一功能…■。

  使用 button::after{ border: none; } 来去除边框

  相关推荐:

  微信小程序如何获取用户session_key,openid,unioni(代码)

  小程序如何实现模板消息发送的功能(图文)

  以上就是微信小程序开发常用的方法总结(代码)的详细内容,更多请关注久澳传媒编程栏目其它相关文章=▽▼=!丽水市小程序制作公司

[重庆seo公司是什么]微信小程序开发常用的方法总结(代码)

您的项目需求

*请认真填写需求信息,我们会在24小时内与您取得联系。