小程序
st646889325
这个作者很懒,什么都没留下…
展开
-
微信小程序———— 订阅消息功能实现
首先通过调用wx.getSetting() 获取用户授权列表的授权状态 ,如果拒绝可以申请用户授权,也可以通过wx.openSetting()指引用户去设置页更改设置。注:如果用户没有勾选红框里的内容,那么下次还是需要用户授权才可以下发消息的。本文主要介绍下 微信小程序 订阅消息 功能的使用及一些注意事项。添加模板之后就是使用啦,下发消息是需要用户授权的,来看下API。data里面的数据对应的就是选用模板里面字段设置的名称。如果用户允许了,那么就可以给用户下发消息了。参数都很简单,文档也很清晰。原创 2024-07-01 10:45:18 · 300 阅读 · 0 评论 -
小程序之web-view中的页面分享
它的返回值就是对应的分享信息,这个时候我们拿到了对应的webview里面的url之后就可以做一些自己需要的操作了。由于整个小程序只有一个web-view,导致了所有页面的切换都是在一个原生页面下进行的,所以如果需要进行回退,最好是新增一个web-view的页面,用到专门处理分享的链接。由于整个小程序都是用web-view嵌入的,这个时候,如果单纯的进行页面分享,只会导致不管在web-view的哪个页面进行分享,都会在点击后进入首页。首先是开启小程序的页面分享功能。原创 2023-10-10 09:39:31 · 2970 阅读 · 0 评论 -
微信小程序web-view嵌入uni-app H5页面,通过H5页面传参给小程序进行转发分享页面,并通过点击转发出来的卡片,定向打开对应H5路径
在H5项目的App.vue页面获取参数实现自动跳转到对应页面,包括携带的参数值。原创 2023-10-10 09:36:22 · 1164 阅读 · 0 评论 -
实现微信小程序和手机app(基于vue)PDF预览功能
在我的项目中,pdf文件是以url的形式提供的,我们在页面中放一个iframe,他的src属性等于到viewer.html的相对路径 ‘/pdfplugin/web/viewer.html?file=’ ,file后拼接你的pdf的url就可以了。将下载下来的文件解压,放在项目的public目录下。原创 2023-07-25 15:11:40 · 552 阅读 · 0 评论 -
微信小程序如何从空白项目拉取一个已有项目
微信小程序如何从git上拉取项目到本地原创 2023-01-28 10:07:18 · 461 阅读 · 0 评论 -
小程序 获取日期
小程序 获取日期原创 2022-06-23 09:50:49 · 292 阅读 · 0 评论 -
微信小程序与uni-app的区别
在微信小程序的平台上,两者的基础用法除了语法外基本一致,在此不讨论使用uni-app制作H5、App的特殊情况,只说最通俗易懂的语法区别。触摸事件名称:①微信小程序:bindtap②uni-app:@click函数传参方式:①微信小程序:<view bindtap="click" data-id="id"></view>②uni-app:<view @click="click(id)"></view>函数接收参数:①微信小程序:funct原创 2021-07-07 16:02:53 · 581 阅读 · 0 评论 -
封装好的picker日期组件,格式类似于:2018-09-19 17:30:55
选择后格式类似于:2018-09-19 17:30:55wxml<picker class='alarm_picker' mode="multiSelector" value="{{dateTime}}" bindchange="changeDateTime" bindcolumnchange="changeDateTimeColumn" range="{{dateTimeArray}}"> <view class="picker"> {{dateT原创 2021-02-24 10:08:09 · 91 阅读 · 0 评论 -
日期时间段选择 - picker之日期选择器
wxml<view class="page"> <!-- 时间段 --> <view class="picker_group"> <picker mode="date" value="{{date}}" end="{{date2}}" bindchange="bindDateChange"> <view class="picker"> {{date}} ..原创 2021-02-24 10:05:44 · 1870 阅读 · 0 评论 -
微信小程序加载更多(分页加载)
业务需求:列表滚动到底部时,继续往上拉,加载更多内容必备参数:(1)pageindex: 1 //第几次加载(2)callbackcount: 15 //需要返回数据的个数其他参数:根据接口的所需参数实现原理:当第一次访问接口时,传递2个必备参数(第1次加载,需要返回数据的个数为15个),和其他参数(需要搜索的字符串)给后台,后台返回第一次数据过来。在请求成功的的回调函数中,判断返回的数据是否>0,是,则取出数据,渲染视图层,并把“上拉加载”显示在列表底部;否,则.原创 2021-02-24 09:25:23 · 668 阅读 · 0 评论 -
小程序-轮播图/旋转木马效果
<swiper class="swiper" circular="true" indicator-dots="true" indicator-color="#E6E6E6" previous-margin='70rpx' next-margin="70rpx" indicator-active-color="#FF6315" bindchange="bindchange"> <swiper-item class="back center " wx:for='{{carouselLis.原创 2020-08-20 13:48:28 · 574 阅读 · 1 评论 -
小程序 sha256.js
/** A JavaScript implementation of the SHA256 hash function.** FILE: sha256.js* VERSION: 0.8* AUTHOR: Christoph Bichlmeier <informatik@zombiearena.de>** NOTE: This version is not tested ...原创 2019-05-24 16:05:17 · 2629 阅读 · 0 评论 -
小程序 图表js
/* * charts for WeChat small app v1.0 * * https://github.com/xiaolin3303/wx-charts * 2016-11-28 * * Designed and built with all the love of Web */'use strict';var config = { yAxisWidth...原创 2019-05-24 16:03:18 · 746 阅读 · 0 评论 -
小程序 日期js
var Moment = function (date) {var date;if (date)this.date = new Date(date);elsethis.date = new Date();return this;};/*** 对Date的扩展,将 Date 转化为指定格式的String* 月(M)、日(d)、12小时(h)、24小时(H)、分...原创 2019-05-24 16:02:40 · 269 阅读 · 0 评论 -
小程序 随机生成32位字符串
/** 生成随机的由字母数字组合的字符串*/function randomWord() {var chars = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', '...原创 2019-05-24 16:00:59 · 3837 阅读 · 0 评论 -
小程序 中文和utf-8转换
/** 中文转换utf-8 */function encodeUTF8(str) {return str.replace(/[^\u0000-\u00FF]/g, function ($0) { return escape($0).replace(/(%u)(\w{4})/gi, "&#x$2;") });}/** utf-8转换中文 */function dec...原创 2019-05-24 15:59:16 · 5096 阅读 · 0 评论 -
小程序上传多图片
1. 定义一个通用的js/* 函数描述:作为上传文件时递归上传的函数体体; * 参数描述: * url是上传地址 * filePaths是文件路径数组 * requestHeader是头部 * fileParams是参数 * successUp是成功上传的个数->0 * failUp是上传失败的个数->0 * count是文件...原创 2019-05-24 15:57:32 · 139 阅读 · 0 评论 -
小程序-页面跳转注意事项
wx.navigateTo(OBJECT)可以传递参数 会存入页面路径栈(目前页面路径最多只能十层) 可以通过 navigateBack 返回 不能跳转到带 tabBar 页面wx.navigateTo({ url: 'test?key=value&key2=value2'})wx.redirectTo(OBJECT)可以传递参数 不会存入页面路径栈 ...原创 2019-04-10 13:54:58 · 272 阅读 · 0 评论 -
小程序-页面Json数据传递
1)页面跳转的方法:wx.navigateTo({ url: '../logistics/logistics?dataList=' + dataList, })2)我们在参数传递的时候数据中可能会有一些特殊字符,例如 :;/?:@&=+$,#所以我们需要用函数将其进行编码,也就是下面所说的两个函数encodeURIComponent (); //函数...原创 2019-04-10 13:51:08 · 1212 阅读 · 0 评论 -
微信小程序WXSS设置样式
一、wxml界面结构wxmL比较容易理解,主要是由八大类基础组件构成: 一、视图容器(View Container): 二、基础内容(Basic Content) 组件名 说明 组件名 说明 view 视图容器 icon 图标 scroll-view 可滚动视图容器 text 文字 swiper 可滑动...原创 2018-09-12 09:43:07 · 735 阅读 · 0 评论 -
小程序 - display 显示类型
小程序布局时.container { display: flex; flex-direction: column; align-items: center; background-color: #b3d4db; }1. flexFlexible Box的缩写,意为"弹性布局",用来为盒状模型提供最大的灵活性。设为Flex布局以后,子元素的float、clear和ve...原创 2018-09-12 10:29:50 · 8299 阅读 · 1 评论 -
微信小程序代码大全
微信小程序官方Demo(Hao-Wu/WeApp-Demo) 微信小应用示例代码(phodal/weapp-quick) 微信小应用地图定位demo(giscafer/wechat-weapp-mapdemo) 微信小应用- 掘金主页信息流(hilongjw/weapp-gold) 微信小程序(应用号)示例:微信小程序豆瓣电影(zce/weapp-demo) 微信小程序-豆瓣电影(hin...转载 2018-09-12 13:29:52 · 493 阅读 · 0 评论 -
小程序小结之框架
文件格式.js: JS 文件,用于书写逻辑.json: 设置文件.wxss: 类似 Css 文件,用于设置样式.wxml: 类似 Html 文件,用于设置结构目录结构一个小程序的目录分为主体,页面以及其他资源(1)主体:项目根目录,用于整个小程序的初始化(2)页面:每个页面都有自己的结构、逻辑和数据(3)其他资源:可放置插件或者图片等资源生命周期(1...原创 2018-09-12 13:55:39 · 143 阅读 · 0 评论 -
实现小程序中的自定义组件
具体实现要做自定义组件,我们先定一个小目标,比如说我们在小程序中实现一下 WEUI 中的弹窗组件,基本效果图如下。Step1我们初始化一个小程序(本示例基础版本库为 1.7 ),删掉里面的示例代码,并新建一个 components 文件夹,用于存放我们以后开发中的所用组件,今天我们的目的是实现一个 弹框 组件,因此,我们在 components 组件中新建一个 Dialog 文件夹...原创 2018-09-19 15:53:53 · 467 阅读 · 0 评论 -
swiper实现滑动放大缩小效果
wxml<swiper class="swiper-block" bindchange="swiperChange" previous-margin="90rpx" next-margin="90rpx" current="0"><block wx:for="{{imgUrls}}" wx:index="{{index}原创 2018-09-25 11:05:57 · 12339 阅读 · 0 评论 -
微信小程序实现轮播图
swiper的相关属性indicator-dots 是否显示小圆点,也可以自己重新设置小圆点circular 是否衔接滑动,就是实现无限滚动previous-margin 与上一张图片的间距next-margin 与下一张图片的间距autoplay 实现自动滚动 wxml<swiper class="imageContainer" bindchange=...原创 2018-09-25 11:10:44 · 1096 阅读 · 0 评论 -
小程序-IOS时间戳坑解决方法
后台传给我的时间是"2017-08-08 10:30:40"计算时间戳的话 Date.parse("2017-08-08 10:30:40")安卓端是可以完美显示的,但是IOS是国际时间不是中国时间var arr = dateStr.split(/[- :]/);let nndate = new Date(arr[0], arr[1] - 1, arr[2], arr[3], ...原创 2018-12-20 15:11:34 · 936 阅读 · 0 评论 -
小程序 输入内容过滤空格和emoji表情
1.定义一个公共的js文件 commonMethod.js/** 替换emoji表情 */function filterEmoji(name){var str = name.replace(/[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|...原创 2018-12-22 15:08:21 · 7630 阅读 · 0 评论 -
小程序——自定义toast
1. 新建一个common的文件,在common文件中创建showToastshowToast.js文件{ "component": true, "usingComponents": {}}showToast.wxml 文件<template name="showToast"> <block wx:if="{{showToast.isShow? s...原创 2018-12-22 15:17:01 · 412 阅读 · 0 评论 -
小程序 -日历展示当前日期
wxml<view class='wrap'> <view> <view class='date-show'> <view class='lt-arrow' bindtap='lastMonth'>》 </view> {{year}}年{{month}}月 <view class='rt-arro...原创 2019-01-04 10:15:11 · 973 阅读 · 0 评论 -
小程序 - 使用组件来选择日历中的日期
1. 创建一个组件template - calendarwxml<template name="calendar"> <view class="flex box box-tb box-align-center"> <view class="calendar pink-color box box-tb"> <view class=&原创 2019-01-04 16:03:46 · 2099 阅读 · 0 评论 -
小程序 - 日历选择
1. 创建component - calendar calendar.wxml<view class="flex box box-tb box-align-center" wx:if="{{calendar}}"> <view class="calendar pink-color box box-tb"> <view class="top-han.原创 2019-01-04 16:08:24 · 1197 阅读 · 0 评论 -
小程序 - 日期选择器
效果图 实现步骤1. 创建组件wxml<template name="datepicker"> <view class="datepicker-bg" wx:if="{{showDatePicker}}" bindtap="closeDatePicker"></view> <input wx:if=原创 2019-01-04 16:12:09 · 655 阅读 · 0 评论 -
微信小程序自定义日历
WXML<view class='container'><view class='month flex m-around'> <view class='arrow' bindtap='prevMonth'>《 </view> <view class='year-and-month'> <pic...原创 2019-01-03 09:24:15 · 629 阅读 · 0 评论 -
微信小程序日历插件 - 极点日历
「极点日历」,支持 1900 年 1 月 ~ 2099 年 12 月这两百年间的公历和农历显示,插件提供了丰富的可配置属性,包括日期的显示方式、选择范围、是否显示农历等,可自定义来适配不同的使用场景。上面画线和标记的地方,支持各种属性的修改和自定义,满足大家所有的需求,属性如下: 使用方式大致步骤如下:1、在微信小程序管理后台——设置——第三方服务,按 AppID...原创 2019-01-03 10:01:32 · 7358 阅读 · 6 评论 -
小程序基础
1 页面构建的基本框架:微信小程序的基本组织文件类型是4种,分别定义,逻辑、配置、样式、页面结构。 项目的结构如上图,如果收紧所有的项目文件,我们发现在项目的根目录有四类配置配置文件,这四类文件是整个项目的配置文件。对于构造一个页面来说,如果不进行配置,那么根目录的配置就是你的配置。当然,由于是根目录,所以,没有针对某一个页面的结构设计,但是,有针对页面的样式设计。1.1 设计...转载 2018-09-11 17:34:06 · 676 阅读 · 0 评论