分类归档

小程序

FWQ
小程序
关于微信小程序收藏功能的实现
这篇文章主要介绍了微信小程序收藏功能的实现代码,基本功能是点击收藏后显示已收藏,在另一个页面出现目前点击收藏的项目。需要的朋友可以参考下 需求 点击收藏后显示已收藏,在另一个页面出现目前点击收藏的项目 需要解决的问题 点击收藏后需要显示已收藏,并且文字状态改变 另一个页面如何知道你点击了收藏,并且获得你点击收藏的数据 如何解决? 数据状态绑定,并且由状态控制样式(三元运算符) 缓存(setStorageSync,getStorageSync),点击页面设置缓存(数据的id),显示页面获取缓存,通过获得缓存id,将整个数据中的获得的id那一项,取出,放入新的数组 具体实现 wxml <image></image>    <text>{{isClick?'已收藏':'收藏'}}</text> 登录后复制 点击页面js  Page({   data: {   job: [],   jobList: [],   id: '',   isClick: false,   jobStorage: [],   jobId: ''   },   haveSave(e) {   if (!this.data.isClick == true) {    let jobData = this.data.jobStorage;    jobData.push({…
2024-11-25 阅读全文 →
FWQ
小程序
分享微信公众号开发模板消息的实例教程
微信极速开发系列文章:点击这里 最近有点小感冒,文章的更新进度延误了一些,希望此系列文章对你研究微信公众开发有帮助。前几篇文章介绍了微信支付。 公众号支付、微信扫码支付、刷卡支付、微信买单 此文来聊聊微信中的业务通知—-微信模板消息 如何查看是否有权限 在交流群中,总是有人问个人订阅号、认证的订阅号、服务号 、认证的服务号 某个接口是否有权限使用。 其实这个问题很简单,在【微信公众平台】现在已经可以直接查看自己的公众号都能使用那些接口。 登录【微信公众平台】进入首页>开发>接口权限 模板消息-权限.png 添加模板消息插件 注意必须是认证的服务号 登录【微信公众平台】进入首页>添加插件功能>找到模板消息按照指引流程操作即可。 模板消息接口使用规则 官方文档 发送消息-模板消息接口 以及 模板消息运营规范 关于使用规则,请注意:1、所有服务号都可以在功能->添加功能插件处看到申请模板消息功能的入口,但只有认证后的服务号才可以申请模板消息的使用权限并获得该权限;2、需要选择公众账号服务所处的2个行业,每月可更改1次所选行业;3、在所选择行业的模板库中选用已有的模板进行调用;4、每个账号可以同时使用25个模板。5、当前每个账号的模板消息的日调用上限为10万次,单个模板没有特殊限制。【2014年11月18日将接口调用频率从默认的日1万次提升为日10万次,可在MP登录后的开发者中心查看】。当账号粉丝数超过10W/100W/1000W时,模板消息的日调用上限会相应提升,以公众号MP后台开发者中心页面中标明的数字为准。 添加模板消息 按照上文添加模板消息插件之后【微信公众平台】首页左侧栏就会出现模板消息菜单,收取点击进去需要同意协议并设置公众账号服务所处的2个行业。 以上设置好了就可以通过关键词查模板库中已有的模板,如果没有找到可以自己申请。 模板消息-添加模板.png 找到合适的模板消息点击详情,进去查看模板详情,如果需要添加即可。添加完成会在我的模板中生成模板消息的 模板ID,模板ID在后面会用到。 模板消息-模板详情.png 测试号添加模板消息…
2024-11-25 阅读全文 →
FWQ
小程序
滚动消息通知小程序的实例代码展示
本篇文章主要介绍了微信小程序-滚动消息通知的实例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧 写在前面:  这次我主要想总结一下微信小程序实现上下滚动消息提醒,主要是利用swiper组件来实现,swiper组件在小程序中是滑块视图容器。 我们通过vertical属性(默认为false,实现默认左右滚动)设置为true来实现上下滚动。 (需要注意的是:只要你的swiper存在vertical属性,无论你给值为true或者false或者不设参数值,都将实现上下滚动) 从深圳回来做了一个微信小程序的小项目,令人欣慰的一点事是,回来很快时间内把在深圳两天的房租给赚回来了,哈哈… wxml <swiper>   <block>    <navigator>     <swiper-item>      <view>{{item.title}}</view>     </swiper-item>    </navigator>   </block>  </swiper> 登录后复制 wxss  .swiper_container {  height: 55rpx;  width: 80vw; } .swiper_item {  font-size: 25rpx;  overflow: hidden;  text-overflow: ellipsis;  white-space: nowrap;  letter-spacing: 2px;…
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序的ajax数据请求wx.request的实例介绍
微信小程序的ajax数据请求wx.request介绍,微信小程序的ajax数据请求,很多同学找不到api在哪个位置,这里单独把小程序的ajax请求给列出来,微信小程序的请求就是wx.request这个api,wx.request(一些对象参数),微信小程序不同于浏览器的ajax请求,可以直接跨域请求不用考虑跨域问题。使用小程序官方 提供的数据请求api发起数据请求方法 wx.request(OBJECT) wx.request发起的是https请求。一个微信小程序,同时只能有5个网络请求连接。 OBJECT参数说明: 示例代码: wx.request( {  url: 'test.php',  data:  {      x: '' ,     y: ''   },     header: {         'Content-Type': 'application/json'   },     success: function(res)     {        console.log(res.data)   } } ) 登录后复制 微信小程序中使用fetch做ajax请求 fetch是一种新的ajax请求规范,经懒人建站测试,fetch在小程序中也是支持的,测试ajax请求代码如下:then中带代码是测试,这里是节选了小部分代码,实际使用需要自行修改。 fetch('http://www.51xuediannao.com/json.php?typeid=34&amp;page=1&amp;pagesize=10')     .then(function(response)     {           if(response.status==200){          that.data.page++;          …
2024-11-25 阅读全文 →
FWQ
小程序
使用js实现微信分享功能的实例代码
这篇文章主要介绍了js实现微信分享朋友链接显示,对学习asp.net编程技术有所帮助,感兴趣的小伙伴们可以参考一下 通常自己做的一个页面想通过微信像朋友分享时,展示的标题和描述都是不是自己想要的,自己查了一些资料,原来是通过js来进行控制展示效果如下: 标题、描述、还有分享的图片都是有js来控制的。js代码如下 <script> var dataForWeixin = { appId: "", MsgImg: "Christmas/201012189457639.gif",//显示图片 TLImg: "Christmas/201012189457639.gif",//显示图片 url: "Christmas/6.html?stra=!u738B!u4F1F",//跳转地址 title: "将我的思念和祝福送给您,颐养源祝大家圣诞快乐",//标题内容 desc: "将我的思念和祝福送给您,颐养源祝大家圣诞快乐",//描述内容 fakeid: "", callback: function () { } };…
2024-11-25 阅读全文 →
FWQ
小程序
手把手教你在小程序中开发一个搜索输入框组件
本篇文章给大家分享一个小程序开发实战,介绍一下怎么开发一个搜索输入框组件,希望对大家有所帮助! 我们这次来谈谈组件的开发。由于小程序可能由很多页面组成,而不同页面可能会有相似的部分,所以我们要将页面合理拆分成不同的组件,就像一块块积木一样,然后再通过组合不同组件完成一个个页面的组装,这就是为什么会有这个概念。【相关学习推荐:】 实战演练 那么话不多说,我们直接开始实战。如何将一个页面拆分成组件是由一系列页面开发后积累的经验所指引的,我们先来做几个页面找找感觉。 比如我们先来做一个小程序首页,我们常见的很多应用首页大多是一个内容列表,其实它有一个比较专业的名称,叫做“feed流”。 比如上图,分别是微博、知乎、美团和boss直聘的小程序首页。可以看到,它们基本都是由一个顶部的搜索输入框和主体部分一个可以持续上划的内容列表所组成的。 首页开发 那么按照这个思路,我们开始自己的小程序首页开发。 首先,我们打开app.json文件,其中pages中的所配置的第一项则是小程序首页。 接着,我们打开首页的index.wxml文件并清空它,然后开始编写我们自己的首页内容。 清空前 清空后 我们可以将上图中所指的热重载打开,这样可以在每次修改完页面的内容后实时看到修改效果,而无需每次手动点击编译。 另外,我们发现上面四个主流小程序的首页都没有标题内容,所以我们也将app.json中的navigationBarTitleText字段改为空字符串即可。 搜索框组件 我们上面提到过,首页由顶部的搜索输入框和主体部分的列表所组成,这就已经天然地将首页拆分成了搜索输入框+内容列表两个组件了,因为这两个元素都可能是被其他页面重复使用的。 那么先来开发搜索输入框,我们以最简单的形式为例,比如上面主流小程序中第2个和第4个。即一个圆角输入框,输入框内部最左侧有一个搜索图标,输入框内部有一行默认的提示文字。 内置组件input 输入框我们会使用小程序提供的内部组件input,文档可见 然后我们在开发页面或组件的时候,注意在每一个元素层级都尽量以一个view标签作为容器,对元素进行包裹,这样后面对于元素在布局中的操控都会更加容易。 比如我们在pages/index/index.wxml中写下如上代码,页面就会呈现出左侧的样子。 这里我们使用了小程序内置组件input,并通过placeholder属性为其设置了默认提示文字。 接着,我们需要使用一些样式代码来对搜索框进行样式修饰。 我们为元素标签添加了样式属性 接着在index.wxss中清空原本的内容,然后添加了我们自己的样式代码。 样式调试 这里讲一个非常实用的开发小技巧,如上图所示,我们可以使用开发者工具提供的调试器查看页面实际渲染出的结构以及样式属性,并且我们可以直接在这里对页面元素的样式进行修改并实时看到效果。甚至对于颜色类的属性我们可以像上图中的操作,点击当前颜色唤出颜色选择面板,进而调整该元素的颜色。 然后,当我们把页面样式调整到最佳效果后,直接将调试器中的样式代码选中并复制,随即粘贴到我们的index.wxss中即可。…
2024-11-25 阅读全文 →
FWQ
小程序
后台https域名绑定和免费的https证书申请的介绍
这篇文章主要介绍了微信小程序 后台https域名绑定和免费的https证书申请详解的相关资料,需要的朋友可以参考下 微信小程序 后台https域名绑定和免费的https证书申请详解 微信小程序在11月3号发布了,这是一个全新的生态,没有赶上微信公众号红利的开发者,运营者可别错过这趟车了。 但是微信的后台需要全https,之前我还不相信,后台注册了后进后台才发现,服务器配置如下图 从后台的服务器配置可以看出 (1)微信小程序后台只支持https,如果公司后台还没支持https的,赶紧要升级了 (2)API请求,文件上传,socket 文件上传和下载,必须是在后台配置的,否则微信不允许你下载       另外,http请求,在微信小程序里,是被微信封装了的,所有微信要封杀哪个域名是非常的方便。 (3)后端的请求,是可以配置多个请求的,比如request 请求,可以配置不同的请求,但是所有的域名必须备案,并且新备案的需要24小时之后才能添加   (4) 每个月只能提交修改3次,每次修改要慎重啊 那哪里有ca证书呢,ca证书很贵,有几百到几千上万的一年的都有,但是阿里云有免费的ca证书,你知道吗?  下面说明免费证书申请步骤 (1)进入后台,点击CA证书,点击购买 (2)默认的是5000需要付费的  选择免费型 DV SSL 你就会发现是不要钱了。 经过绑定申请后,显示的是https。…
2024-11-25 阅读全文 →
FWQ
小程序
关于小程序开发tabbar页面显示的相关问题及解决整理
昨天在微信小程序的开发过程中,遇到一个情况,明明已经定义好tabbar了,却总是不显示。在网络上搜索发现在微信小程序的开发过程中如果有使用过tabbar的同学,很多也遇到同样的 困扰。为什么有些时候代码中明明已经在app.json里面增加了tabbar,可以页面中就是不显示呢?可不可以有些页面显示tabbar,而有些页面不显示tabbar呢? 今天我把我在开发过程中遇到的问题整理出来跟大家分享一下小程序开发教程。 问题1:为什么页面底部不显示tabbar? 很多网友(包括我自己)也遇到过此类问题,我想提醒大家好好想想检查一下是否书写正确!正确书写时tabBar,不要写成tabbar!如果确定书写正确,在app.json里面明明加了tabbar,list里面 也加了路径怎么就是不显示呢?举例,如下代码,为什么屏幕页面底部没有如期出现tabbar呢?   “pages”:[     “pages/clickDemo/clickDemo”,     “pages/logs/logs”,     “pages/index/index”,     “pages/mypage/mypage”   ],   “window”: {     “backgroundTextStyle”:…
2024-11-25 阅读全文 →
FWQ
小程序
实现微信小程序添加手机联系人功能教程
本文主要介绍了微信小程序实现添加手机联系人功能,结合实例形式分析了微信小程序添加联系人的具体步骤,包括布局与逻辑实现技巧,需要的朋友可以参考下,希望能帮助到大家。 1、效果展示   2、关键代码 1)WXML文件 <view>{{phoneNum}}</view> 登录后复制 2)JS文件 Page({  data:{  phoneNum:'12345678901'//测试用的号码,并非真实号码  },  // 长按号码响应函数  phoneNumTap:function(){  var that=this;  // 提示呼叫号码还是将号码添加到手机通讯录  wx.showActionSheet({   itemList: ['呼叫','添加联系人'],   success:function(res){   if(res.tapIndex===0){    // 呼叫号码    wx.makePhoneCall({    phoneNumber: that.data.phoneNum,    })   }else if(res.tapIndex==1){    // 添加到手机通讯录    wx.addPhoneContact({    firstName: 'test',//联系人姓名…
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序授权登录流程时序 – 图文详解
最近在做一个小程序开发的项目。场景布置:同一微信开放平台下拥有相同主体的app和微信小程序来完成同样的业务,用户进入app或者微信小程序时必须获取用户的unionid来确认当前的用户身份,完成登录。小程序“获取用户信息”api(getuserinfo)的调用方式和之前相比有了较大更新,优雅的实现用户授权和登录非常重要,以下是我在微信小程序授权登录相关流程在开发时候的实现思路和总结,分享如下。 一、微信小程序登录流程时序 说明: 小程序调用wx.login() 获取 临时登录凭证code ,并回传到开发者服务器 开发者服务器以code换取 用户唯一标识openid 和 会话密钥session_key。 临时登录凭证code只能使用一次 什么是openid? 在关注者与公众号产生消息交互后,公众号可获得关注者的OpenID(加密后的微信号,每个用户对每个公众号的OpenID是唯一的。对于不同公众号,同一用户的openid不同)。——微信公众平台开发者文档 普通用户的标识,对当前公众号唯一 不同的公众号,同一个用户,openid不同 你可以简单的理解为 openid = hash(uid + app_id) 登录后复制 什么是unionid? 如果开发者拥有多个移动应用、网站应用、和公众帐号(包括小程序),可通过unionid来区分用户的唯一性,因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号(包括小程序),用户的unionid是唯一的。换句话说,同一用户,对同一个微信开放平台下的不同应用,unionid是相同的。UnionID机制说明 如果开发者在多个移动应用、网站应用和公众帐号之间有统一用户账号的需求,需要前往微信开放平台(open.weixin.qq.com)绑定公众号后,便可利用UnionID机制来满足上述需求。 一个微信开放平台帐号下可以有多个移动应用,网站应用,公众账号和小程序 只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号(包括小程序),用户的unionid是唯一的。…
2024-11-25 阅读全文 →