Wechat_Applet
关注
分享
扫一扫
文章平均质量分 59
Wechat_applet
HqL丶1024
这个作者很懒，什么都没留下…
展开
-
小程序父传子，子传父组件
<button type="primary" bindtap="getoption">确定</button> data: { }, methods: { getoption(e) { this.triggerEvent('index', {i:1})//triggerEvent广播数据 index为广播事件 } } <share bind:index="getoption"></share> getoption.原创 2020-10-23 18:00:35 · 600 阅读 · 0 评论
-
无系列和有系列小程序商城购物车
可直接拷贝代码复制到页面，直接可以使用wxml<view class="scroll"> <scroll-view class="scroll" scroll-y="true"> <view wx:for="{{carts}}" wx:key='index'> <view class="cart_container">...原创 2020-04-13 14:17:54 · 262 阅读 · 0 评论 -
小程序递归下载图片和下载视频
<view class="info"> <block wx:for="{{dynamic_list}}" wx:key="index"> <view class='rolTop'> <view class="rolAvatar"> <view class="avatar"> &...原创 2020-04-08 13:22:29 · 406 阅读 · 0 评论 -
微信小程序封装api接口
在utils新建个http.js文件，然后写入下列代码export default function wxRequest(url, params = {}, method = "GET") { return new Promise(function (resolve, reject) { wx.showLoading({ title: '正在加载中' }) wx.re...原创 2020-04-01 15:46:58 · 403 阅读 · 0 评论 -
小程序Promise函数封装
app.js里获取pages需要拿的参，使用promise处理 getlogin() { var that = this return new Promise(function (resolve, reject) { wx.login({ success: (res) => { wx.request({ ...原创 2019-12-14 11:11:16 · 185 阅读 · 0 评论 -
前端生成小程序二维码
效果1.文件目录引入的painter文件地址2.引入的posterView.jsconst getPoster = (qrcodeText) => { const poster = { "width": "256px", "height": "256px", "background": "#f8f8f8", "views": [{ "type": "qrcode", "c原创 2022-01-08 11:22:19 · 2820 阅读 · 0 评论 -
h5,小程序大转盘抽奖
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...原创 2019-11-21 11:52:54 · 628 阅读 · 0 评论 -
小程序使用Animate.css动画集
Animate.css官网1.引入css文件css源码提取链接: https://pan.baidu.com/s/1hgo6soO-qNXbmycvkm2szw 提取码: 2ej2 2.使用<view bindtap="donghua" class="text animated flipInY"> 展现动画</view><view wx:if="{{showTYpe}}" class="text animated {{wobble}}"> Ani.原创 2021-01-08 11:57:42 · 313 阅读 · 0 评论 -
小程序navigateTo跳转新方法可直接带对象/数组
A页面//跳转B页面wx.navigateTo({ url: '../solitaireAss/solitaireAss', events: { xiaoma: (data) => { console.log(data)//用来接收跳转的页面传过来的参数 }, }, success: (res) => { // 通过eventChannel向被打开页面传送数据原创 2020-12-29 11:17:00 · 1006 阅读 · 0 评论 -
微信小程序直播前端实现
<live-player id="player" autoplay="true" src="{{videoUrl}}" bindstatechange="statechange" binderror="error" object-fit="fillCrop" orientation="{{orientation}}" /><!-- 透明底为了触发弹出层 --> ...原创 2019-11-15 17:16:27 · 4185 阅读 · 0 评论 -
js对象和对象合并
var listgr = Object.assign(this.data.listgr, arrygr);原创 2020-11-20 17:42:44 · 725 阅读 · 0 评论 -
小程序使用editor组件富文本编辑
效果图提交打印上代码1.文件目录assets文件链接: https://pan.baidu.com/s/1CVyQgbQAVIUR6ZcSktcVLg 提取码: 5ush 复制这段内容后打开百度网盘手机App，操作更方便哦<view class="container" style="height:{{editorHeight}}px;"> <editor id="editor" class="ql-container" placeholder="{{placehol原创 2020-11-03 14:42:34 · 1181 阅读 · 0 评论 -
小程序年月日时间段区间选择
<view class="Zon"> <view class="picker_view"> <view class="picker__title"> <text>接龙时间</text> </view> <view class="picker__content"> <block wx:if="{{is_issueTime}}"> <picker mode="date" st.原创 2020-10-22 11:29:34 · 1611 阅读 · 2 评论 -
小程序自定义上传富文本并预览
上传时的效果预览时的效果代码如下（可直接全部复制查看，注意：下面上传的接口需要改成你们自己的服务器上传接口）<view class="col"> <text>编辑富文本</text> <view class="fill_text" bindtap="addText" wx:if="{{baseArr.length == 0}}"> <view>请点击下方图片或文字，编辑内容</view> </view>原创 2020-10-22 10:33:49 · 709 阅读 · 3 评论 -
js获取多少天以后的时间
// 获取多少天后的时间 getDateStr(today, addDayCount) { var dd; if (today) { dd = new Date(today); } else { dd = new Date(); } dd.setDate(dd.getDate() + addDayCount); //获取AddDayCount天后的日期 var y = dd.getFullYear(); var m = .原创 2020-10-21 12:23:22 · 1021 阅读 · 0 评论 -
JS对象转JSON转数组
1、JS对象转JSON方式：JSON.stringify(obj)var json = {"name":"iphone","price":666}; //创建对象；var jsonStr = JSON.stringify(json); //转为JSON字符串console.log(jsonStr);2、JS数组转JSON//数组转json串var arr = [1,2,...原创 2020-03-06 17:39:05 · 3068 阅读 · 0 评论 -
Vue手机号正则匹配，姓名加密展示
一丶手机号（1）正则匹配 var phone = "13807999985"; var resultPhone = phone.replace(/^(\d{3})\d{4}(\d+)/, "$1****$2"); console.log(resultPhone);//138****9985（2）substr截取 var phone = "17610603529"; var mphone = phone.substr(0, 3) + "****" + phone.原创 2020-10-09 11:53:56 · 2293 阅读 · 0 评论 -
微信小程序实现订阅消息
data:{ weixinVersion:'',//微信版本号 templateId:[]}onLoad: function (options){ let that = this wx.getSystemInfo({ success: function (res) { let version = res.version; version = version.replace(/\./g, "") that.setData({ weixinV.原创 2020-09-28 09:50:25 · 626 阅读 · 0 评论 -
js时间搓转时间，日期横杠转斜杠，时间转时间搓，年月日补个零，星期几，获取当前时间
console.log(app.getNowFormatDate(app.timeShj(res.data.jielongMemberExpirationTime * '1000'))) //时间搓转时间 timeShj(a) { var d = new Date(a); d = d.getFullYear() + "/" + (d.getMonth() + 1) + "/" + d.getDate(); return d; }, // 年与日补个0 getNo原创 2020-09-26 12:11:48 · 1762 阅读 · 0 评论 -
小程序上传下载文件
herbplantist.com/sucai/public/index.php/post/post/uploadFilewx.chooseMessageFile({ count: 1, type: 'file', success (res) { console.log(res) const tempFilePaths = res.tempFiles[0].path wx.uploadFile({ url: "https://api110.", f原创 2020-09-17 14:49:22 · 738 阅读 · 5 评论 -
小程序点击回到顶部
一丶scroll-view标签包裹的回到顶部1.标签上增加两个事件bindscroll=“scrollPosition”scroll-top="{{topPosition}}"<scroll-view scroll-y="true" bindscroll="scrollPosition" scroll-top="{{topPosition}}">我是滚动区域</scroll-view><!-- 回到顶部按钮--><block wx:if="{{sho原创 2020-09-14 10:39:51 · 403 阅读 · 0 评论 -
小程序获取当前手机型号并作出相应操作
//获取当前微信版本 weChatVersion() { let that = this let info = wx.getSystemInfoSync(); if (/iPhone X/i.test(info.model) || /iPhone 11/i.test(info.model)) { that.globalData.tabbarHeht = true } },原创 2020-09-11 09:59:26 · 1205 阅读 · 0 评论 -
小程序点击打开doc文档类型查看
更加详细的内容请查看微信小程序API（wx.openDocument） dopuWrod(){ wx.downloadFile({ // 示例 url，并非真实存在 url: 'https://sucai.suoluomei.cn/sucai_zs/file/20200909095822-%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98.doc', success: function (res) { c原创 2020-09-09 10:05:20 · 611 阅读 · 0 评论 -
小程序长按识别取消IOS系统弹出保存
body, html { background: #f5f5f5; touch-callout: none; -webkit-touch-callout: none; -ms-touch-callout: none; -moz-touch-callout: none; }原创 2020-09-03 15:22:26 · 277 阅读 · 0 评论 -
小程序某颜首页效果展示
<view class="pages"> <view class="pagesTop"> <image src="https://sucai.suoluomei.cn/sucai_zs/images/20200831095626-1598838867%281%29.png"> </image> </view> <view class="pagesButon"> <image mode="widthFix" sr.原创 2020-08-31 17:13:59 · 260 阅读 · 0 评论 -
小程序上下滑动展示二维码
<view class="pages"> <view class="pagesTop"> <image mode='widthFix' src="https://sucai.suoluomei.cn/sucai_zs/images/20200831095626-1598838867%281%29.png"> </image> </view> <view bindtouchstart="touchMove" class="pa..原创 2020-08-31 10:27:34 · 355 阅读 · 0 评论 -
小程序scroll-view实现上拉下拉加载刷新
<scroll-view scroll-y='true' scroll-with-animation='true' bindscrolltolower='pullup' refresher-enabled='true' style="height:100%" bindrefresherrefresh='dropDown' refresher-triggered='{{xialaType}}'></scroll-view> data:{ xialaType:false原创 2020-07-22 13:59:04 · 1319 阅读 · 0 评论 -
小程序使用onPageNotFound监控当前是否有该页面
类似于webApp的404页面 onPageNotFound(res){ wx.switchTab({ url: 'pages/index/index', }) },原创 2020-07-21 16:45:23 · 989 阅读 · 0 评论 -
小程序scroll-view左右滑动联动效果
<view class='cont-pro'> <!-- 左侧列表 --> <scroll-view scroll-y='true' scroll-with-animation="true" style="width:25%;"> <view class='pro_left'> <view wx:for="{{serviceTypes}}" wx:key='index' class="pro_title {{index==currentL.原创 2020-07-20 16:06:49 · 357 阅读 · 0 评论 -
小程序根据节点实现城市选择器
先把JS文件放入项目中链接: https://pan.baidu.com/s/1C52pcxriEFbK2p1p7aCG2g 提取码: kb9a在放入以下代码<scroll-view scroll-y="true" style="height: {{winHeight}}px;" scroll-into-view="{{scrollTopId}}" class="city_list"> <view class='top_module' id="top"> <..原创 2020-07-09 13:39:21 · 938 阅读 · 1 评论 -
获取视频第几帧作为封面
<image mode="aspectFill" src="{{item.file[0].file_path+'?x-oss-process=video/snapshot,t_2000,f_jpg,w_0,h_0,m_fast'}}"> </image>原创 2020-07-06 15:10:59 · 1466 阅读 · 0 评论 -
小程序使用云开发，拍照获取银行卡卡号
app.js配置 if (!wx.cloud) { console.error('请使用 2.2.3 或以上的基础库以使用云能力') } else { wx.cloud.init({ env: 'dev-37px5',//这个是专属的Id，需要到文档配置 traceUser: true, }) }触发拍照事件//银行卡 yinhangka() { this.photo("yinhangka")原创 2020-07-02 18:08:10 · 1565 阅读 · 1 评论 -
数组.map使用indexOf获取下标
var array = [ { name: "aa", }, { name: "bb", }, { name: "cc", }, { name: "dd", }, { name: "ee", }, ]; var line = array.map((item) => item.nam...原创 2020-07-01 16:46:24 · 4196 阅读 · 0 评论 -
选中取消push和splice删除
data:{arry:[ { id:1, name:'dada' }, { id:2, name:'aaa' } ]} fanxuan(){ let that = this let arry = that.data.arry let id = '4'//当前选中的id let aaa = { id:3, name:'woshi3' }//当前选中的对象原创 2020-06-24 12:06:47 · 518 阅读 · 0 评论 -
小程序锚点的使用
<scroll-view scroll-into-view="{{toView}}" style="height:{{pageGaodu.windowHeight}}px" scroll-y="true" scroll-with-animation="true"> <view bindtap="wxpaley" data-havs="havs"> 点击去目标地方 </view> <view class="shopListTitle" id='havs'&g原创 2020-06-23 11:10:07 · 491 阅读 · 0 评论 -
小程序返回上一页onshow接收参数
当前页面接收 onShow: function (options) { let pages = getCurrentPages() var curPage = pages[pages.length - 1]; // 当前页面 console.log(curPage.data.suibian) },带参数返回上一页 var pages = getCurrentPages(); // 获取页面栈 var prevPage = pages[pages.lengt原创 2020-06-22 14:10:07 · 2048 阅读 · 0 评论 -
小程序调用map地图展示路线
进入地图之前先调用定位 addZonFor(e){ let that = this let index = e.currentTarget.dataset.index let item = e.currentTarget.dataset.item wx.getSetting({ success(res) { console.log('res是否开启授权', res) if (!res.authSetting['scope.us.原创 2020-06-19 17:40:25 · 749 阅读 · 0 评论 -
小程序引入VantWeapp开发
https://blog.youkuaiyun.com/AK852369/article/details/98754465原创 2020-06-13 17:27:39 · 489 阅读 · 0 评论 -
小程序showActionSheet弹起选择器
wx.showActionSheet({ itemList: ['编辑圈子', '管理圈友', '账户管理'], success: function(res) { if (!res.cancel) { console.log(res.tapIndex) } } });原创 2020-06-11 16:48:18 · 777 阅读 · 1 评论 -
小程序通过wx.createSelectorQuery操作DOM节点来在页面某处显示内容
可以先复制代码到页面查看效果<scroll-view scroll-y='true' style="height:100vh;" bindscroll="bindscroll" scroll-into-view="{{toview}}"> <view class="rol"> <text class="title" id="normalServe">常用应用</text> <text class="title" id="normalServe原创 2020-06-10 16:46:23 · 1136 阅读 · 0 评论