分类归档

小程序

FWQ
小程序
微信小程序之购物车功能实现
前言 以往的购物车,基本都是通过大量的 DOM 操作来实现。微信小程序其实跟 vue.js 的用法非常像,接下来就看看小程序可以怎样实现购物车功能。 需求 先来弄清楚购物车的需求。 单选、全选和取消,而且会随着选中的商品计算出总价 单个商品购买数量的增加和减少 删除商品。当购物车为空时,页面会变为空购物车的布局 根据设计图,我们可以先实现静态页面。接下来,再看看一个购物车需要什么样的数据。 首先是一个商品列表(carts),列表里的单品需要:商品图(image),商品名(title),单价(price),数量(num),是否选中(selected),商品id(id) 然后左下角的全选,需要一个字段(selectAllStatus)表示是否全选了 右下角的总价(totalPrice) 最后需要知道购物车是否为空(hasList) 知道了需要这些数据,在页面初始化的时候我们先定义好这些。 代码实现 初始化 Page({ data: { carts:[], // 购物车列表 hasList:false, // 列表是否有数据…
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序验证码如何实现?(源代码)
本篇文章给大家带来的内容是关于微信小程序验证码如何实现?(源代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 验证码: <input><view>{{code}}</view><button>登录</button> 登录后复制 index.js data: { code: "", makecode:"", }, //获取输入验证码 makecodeInput:function(e){ this.setData({ makecode:e.detail.value }) }, // 登录 login: function() { if(this.data.makecode != this.data.code){ wx.showToast({ title: '验证码不正确', icon: 'none', duration: 2000 }) } }, //验证码 createCode() { var code;…
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序把文字玩出花样(弹幕)
小程序里的弹幕类应用大部分只支持文字,而图片和音频这一块功能是缺失的,本文会从产品角度来讲诉如何打造一款支持表情的弹幕小程序。 实现效果 思路: input 获取输入文字,richtext显示包含图片的弹幕,设置richtext中文字的方向并滚动起来,滑动改变文字大小,文字颜色等操作 实现代码: 1.使用input输入文字、支持emoji表情 先定义的一个”danmu”对象来保存input输入的弹幕文字以及弹幕样式、 danmu: {       fontColor: "#ffffff",       text: "默认弹幕~",       fontSize: "40px",       glow: "#ffff00",       speed: '10s', }, 登录后复制 接着定义”nodes”对象显示数据text:弹幕文字;fontSize:文字大小;fontColor:文字颜色;glow:文字发光;speed:滚动速度。 使用input组件输入文字: <input> 登录后复制 cursor-spacing设置input中光标与键盘的距离 2.richText显示包含图片的弹幕 定义nodes对象来更新弹幕 nodes: [{     name: 'div',     attrs: {     class: 'danmu-text'},     children: […
2024-11-25 阅读全文 →
FWQ
小程序
怎样将小程序移到发现页
怎样将小程序移到发现页 在微信中设置一下即可在发现页打开微信小程序,具体方法如下: 1、切换到【我】页面,点击【设置】 2、找到【通用】并进入 3、点击【发现页管理】 4、将小程序打开即可,此时返回【发现页】即可看见小程序入口 以上就是怎样将小程序移到发现页的详细内容,更多请关注米云其它相关文章!
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序与页面wepy框架布局应用案例分享
个人道行不深,存在瑕疵的多多谅解,我会继续学习更新更加有价值的文章分享给大家的,希望大家多多给予指出与改正,咱们一起来共同学习与进步!这篇文章是关于微信小程序学习,还有wepy框架应用。 微信小程序是一种不需要下载安装即可使用的应用,在国内它在企业推广中的受欢迎度以及就这两年的使用及普及热度,然而就是因为它的备受欢迎度以及越来越被企业所重视,也就形成了咱们开发人员对小程序的开发的掌握;具体它的热度这里就不多扯了,而咱重点关心的是开发细节。所以今天咱们就一步一步的剖析和认识一下这个小程序:一 、开发准备工作 1、首先登录微信公众平台  https://mp.weixin.qq.com ,选择小程序( 没有注册过的需要向注册一下公众号 ), 登录后 “设置”-“开发者设置”中,查看微信小程序的 AppID 注:不可直接使用服务号或订阅号的AppID 登录后复制 2、下载开发工具 下载地址: https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html?t=1476197489869 登录后复制 3、新建项目 打开并使用微信扫码登录 选择创建“小程序项目” 选择一个要创建项目的文件夹(空文件夹) 输入获取到的 AppID(可以选择不填,但这样会有很多功能受限制) 输入你的项目名 登录后复制 二、编辑器架构布局理解 准备就绪后,进入编辑器进行项目编辑。 登录后复制…
2024-11-25 阅读全文 →
FWQ
小程序
小程序与后台进行交互的实现(附代码)
本篇文章给大家带来的内容是关于小程序与后台进行交互的实现(附代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 最近在做小程序,第一次上手,设计页面还比较容易,就是设计到与后台做交互的时候,我要崩溃了,看了官方api还是不会,问公司的前辈,人家直接给我写好了模板,来看看: /引入代码 var call = require("../util/request.js") Page({   data: {     pictureList: [],   },   onLoad: function () {     var that = this;     //调用封装的方法,为了方便我直接在页面加载的时候执行这个方法     call.getData(url, this.shuffleSuc, this.fail);     this.loadMsgData(that);   },   shuffleSuc: function (data) {     var that = this;     that.setData({       pictureList: data.rows     })     //我后面测试了一下,直接this.setData也可以,但是因为我在没有使用封装方法的时候     //this.setData报过错,不能直接用this,所以我在赋值的时候一般都会加上var that = this;   },   fail: function () {     console.log("失败")   }, }) 登录后复制 前后台交互是这样的:…
2024-11-25 阅读全文 →
FWQ
小程序
二维码登录如何使用?总结二维码登录实例用法
这篇文章主要大家详细解析了微信QQ的二维码登录原理js代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下在很多地方就是都出现了使用二维码登录,二维码付款,二维码账户等应用(这里的二维码种马,诈骗就不说了),二维码验证,多终端辅助授权应用开始多起来,这里先说下啥是二维码,其实二维码就是存了二进制数据的黑白图片,当出现要求二维码登录的时候,服务器会生成一条临时的唯一的二维码信息,发送到客户端以二维码(图片)的形式写入到网页,然后你就会看到统一的四个方形的二维码,如果做的好这个二维码信息应该是有时效的,这里暂且不考虑这些,就简单的微信登录作为例子看看吧:首先说下整个授权流程:在客户端网页中会不断向服务器发送https连接,并且这里传输很少的数据之后就断开连接了,下面看下微信网页中这个login1c709c.js文件:(function($, _aoWin) { &n 1. 简介:这篇文章主要大家详细解析了微信QQ的二维码登录原理js代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 2. 简介:在很多地方就是都出现了使用二维码登录,二维码付款,二维码账户等应用(这里的二维码种马,诈骗就不说了),二维码验证,多终端辅助授权应用开始多起来,这里先说下啥是二维码,其实二维码就是存了二进制数据的黑白图片,当出现要求二维码登录的时候, 3. 简介:这篇文章主要大家详细解析了微信QQ的二维码登录原理js代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 4. 简介:近年来,二维码的使用越来越风生水起,本篇文章主要介绍了Java二维码登录流程实现代码,其中包含短地址生成,有兴趣的可以了解一下。 5. 简介:最近在做一个扫码登录功能,为此我还在网上搜了一下关于微信的扫描登录的实现方式。当这个功能完成了后,我决定将整个实现思路整理出来,方便自己以后查看也方便其他有类似需求的程序猿些。  要实现扫码登录我们需要解决两个问题:  1.  在没有输入用户名及密码的情况下,如何解决权限安全问题?换句话讲,如何让服务器知道扫码二维码的客户端是一个合法的用户?  2.  服务器根据用户在客户端的选择如何实时在网页上 … 6. 简介:js微信扫描二维码登录网站技术原理 7. 简介:最近在做一个扫码登录功能,为此我还在网上搜了一下关于微信的扫描登录的实现方式。当这个功能完成了后,我决定将整个实现思路整理出来,方便自己以后查看也方便其他有类似需求的程序猿些。要实现扫码登录我们需要解决两个问题:1.  在没有输入用户名及密码的情况下,如何解决权限安全问题?换句话讲,如何让服务器知道扫码二维码的客户端是一个合法的用户?2.  服务器根据用户在客户端的选择如何实时在网页上作出相应的响 … 8. 简介:wxLogin.js这个怎么用啊,直接填上参数就行了吗?没有出来二维码页面是空白的啊??求解 9.…
2024-11-25 阅读全文 →
FWQ
小程序
微信页面上面那一行字怎么设置
设置微信页面上面那一行字的方法:首先打开微信软件,进入【我】的页面;然后点击【收藏】进入,并在【我的收藏】中点击页面右上角的【+】号;接着输入想要显示的内容,并点击右上角的【…】符号;最后在弹出的窗口中选择【在聊天中置顶】即可。 本文演示环境:MIUI12.0.22系统、8.0.1、小米11手机。 设置微信页面上面那一行字: 首先打开微信软件,进入【我】的页面; 然后在【我】的页面中,点击【收藏】进入; 接着在【我的收藏】中点击页面右上角的【+】号; 然后在打开的页面中,输入想要显示的内容,再点击右上角的【…】符号,并在弹出的窗口中选择【在聊天中置顶】; 最后返回微信聊天页面即可看到在页面最上面显示了刚才设置好的文字内容。 相关推荐: 以上就是页面上面那一行字怎么设置的详细内容,更多请关注米云其它相关文章!
2024-11-25 阅读全文 →
FWQ
小程序
小程序开发原理是什么
小程序是基于WEB规范,采用HTML,CSS和JS等搭建的一套框架,微信官方给它们取了一个非常牛逼的名字:WXML,WXSS,但本质上还是在整个WEB体系之下构建的。  WXML,个人推測在取这个名字的是微信的Xml,说究竟就是xml的一个子集。 WXML采用微信自己定义的少量标签WXSS,大家能够理解为就是自己定义的CSS。实现逻辑部分的JS还是通用的ES规范。而且runtime还是Webview(IOS WKWEBVIEW, ANDROID X5)。 小程序 小程序文件夹结构 一个完整的小程序主要由下面几部分组成:  一个入口文件:app.js  一个全局样式:app.wxss  一个全局配置:app.json  页面:pages下。每一个页面再按文件夹划分。每一个页面4个文件  视图:wxml,wxss  逻辑:js。json(页面配置,不是必须) 注:pages里面还能够再依据模块划分子文件夹,孙子文件夹。仅仅须要在app.json里注冊时填写路径即可。 小程序打包 开发完毕后。我们就能够通过这里可视化的button。点击直接打包上传公布,审核通过后用户就能够搜索到了。  相关推荐:《》 那么打包怎么实现的呢?  这就涉及到这个编辑器的实现原理和方式了。它本身也是基于WEB技术体系实现的,nwjs+react,nwjs是什么:简单是说就是node+webkit,node提供给我们本地api能力,而webkit提供给我们web能力,两者结合就能让我们使用JS+HTML实现本地应用程序。  既然有nodejs,那上面的打包选项里的功能就好实现了。  ES6转ES5:引入babel-core的node包  CSS补全:引入postcss和autoprefixer的node包(postcss和autoprefixer的原理看这里)  代码压缩:引入uglifyjs的node包 注:在android上使用的x5内核。对ES6的支持不好。要兼容的话,要么使用ES5的语法或者引入babel-polyfill兼容库。 打包后的文件夹结构 小程序打包后的结构例如以下: …
2024-11-25 阅读全文 →
FWQ
小程序
怎么修改微信小程序名称
微信小程序改名怎么改?微信小程序改名在哪里改?一起来看看吧。 怎么修改微信小程序名称 1、登录小程序后台,点击设置 2、点击小程序名称右侧,“去改名” 3、通过微信认证流程改名即可 注意: 1.未发布的(个人类/组织类)小程序在发布前可改名2次 2.已发布的组织类小程序可通过微信认证的方式改名,已发布的个人类小程序暂不支持改名。 推荐学习: 以上就是怎么修改微信小程序名称的详细内容,更多请关注米云其它相关文章!
2024-11-25 阅读全文 →