![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
小程序
前端技术栈
看面试题 【web前端面试小助手】 小程序
展开
-
解决小程序中textarea ios端样式不兼容的两种方法
今天遇到在小程序里面textarea会存在一定的兼容性问题,textarea有默认的内边距,在安卓手机和ios手机显示的时候,ios手机的内边距会比安卓手机的内边距大很多,所以会造成样式不兼容第一种方法:解决的办法:通过wx.getSystemInfoSync()获取手机的机型;获取到对应的isIos的布尔值,再进行三元判断即可第二种方法:微信小程序文档标明disable-default-padding这个属性可以去除!原创 2022-11-02 09:52:37 · 1565 阅读 · 0 评论 -
云函数实现商家转账到零钱 V3版本
自己研究的3天终于实现 云函数实现商家转账到零钱(V3版本)不懂的可以咨询wx:mv55776。官方没有给node的示例。原创 2022-10-10 16:46:20 · 520 阅读 · 1 评论 -
小程序输入框完成自动切换到下个输入框
先看图<view class="w-80 h-100 rad-10 b-a-9 tc f-50" v-for="(item,index) in 6"> <input class="w-80 h-100 " maxlength="1" type="text" @input="inputListener(index)" :focus="focus && (focusIndex == index)"/></view> data原创 2022-05-13 16:21:45 · 1347 阅读 · 0 评论 -
微信小程序 TypeError: _typeof3 is not a function
修改一下 @babel/runtime/helpers/typeof.js 文件 全部替换 即可function _typeof2(o) { "@babel/helpers - typeof"; return (_typeof2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) { return typeof o; } : function...原创 2021-10-22 18:54:01 · 4375 阅读 · 6 评论 -
在uniapp中监听globalData中的值变化
小程序里怎么去监听app.js里的globalData数据变化呢1、先再app.vue 中定义一个全局数据对象globalData,再对象里定义好相应的属性与属性值globalData:{ count:0},methods:{ watch:function(method,istr){ var obj=this.globalData console.log(obj) Object.defineProperty(obj,istr,{ configurable:true原创 2021-08-11 10:14:48 · 5939 阅读 · 0 评论 -
研发实时公交车的小程序,查公交用自己的
微信搜索 出行实时公交扫码体验 出行实时公交1、首页做了收藏路线和附近路线2、公交详情查看公交到达时间,进站语音提醒,方向切换和收藏功能3、主菜单功能如下图有乘车码和路线规划,地铁线路图等4、地球仪是一个3d模型, 可以放大缩小,查看地球每个地方5、前端面试题库是一款非常不错的面试题库里面包含有面试题分类, 企业面试题. 面试题宝典、面试技巧等1000多条热门面试题...原创 2021-08-05 18:45:40 · 1983 阅读 · 9 评论 -
如何在微信小程序内使用外部字体
通过 font-face 使用外部字体首先通过 css 引入地址,然后在需要使用该字体时使用定义的 font-family 即可。@font-face { font-family: "kaiti"; src: url("https://spkf-zsxn-prod.s3.cn-north-1.amazonaws.com.cn/pic/livecenter/kaiti.ttf");}.test { font-family: "kaiti";}这里的 url 要用 CDN.原创 2021-05-28 13:36:15 · 713 阅读 · 0 评论 -
微信小程序日期下拉框规定显示年,月
1.微信官方文档展示日期为年,月,日,如图所示:项目要求日期下拉框组件显示只要年,月,修改如下,只需要添加属性fields="month"就可以了,如果只显示年那就是fields="year",start和end属性表示可以选择的开始时间和结束时间<picker mode="date" fields="month" value="{{date}}" start="2016-01-01" end="2018-12-31" bindchange="getDateTime"> ..原创 2021-04-28 17:17:27 · 1258 阅读 · 0 评论 -
原生小程序开发之点击事件 bindtap和catchtap的区别
在小程序的api中发现点击事件有两种bindtap和catchtap两个,发现两个都可以实现点击事件该有的功能,但是到底有什么区别呢?用法的区别:bintap 会发生冒泡事件,catchtap 不会发生冒泡事件注:返回结果type //点击事件的类型changedTouches // 元素距离文档的x轴,y轴,可视窗口的x轴,y轴的距离。target 事件的监听,事件引发的一系列后续变化 id //元素的id offsetLeft //元原创 2021-02-05 16:22:03 · 1485 阅读 · 0 评论 -
实现微信小程序picker 省市区 自定义数据 支持三级联动
再使用微信小程序时发现 当mode="region" 时数据 选择的省市区的数据不支持后台返回的数据以下实现后台返回数据操作先设置HTMLname 字段名字要替换掉 <view class=" h-100 b-b l-h-100"> <picker mode="multiSelector" bindchange="bindMultiPickerChange" bindcolumnchange="bindMultiPickerColumnC...原创 2021-02-03 17:46:36 · 2755 阅读 · 4 评论 -
微信小程序上传图片转化为base64格式
上传图片函数 clickimage: function(e) { var index = e.currentTarget.dataset.index; var count = 4; var that = this; wx.chooseImage({ count: count, sizeType: ['compressed'], sourceType: ['album', 'camera'], success(res) {原创 2021-01-22 17:31:37 · 877 阅读 · 0 评论 -
ES6 数组中的对象去重
用set 去重let person = [ {id: 0, name: "小明"}, {id: 1, name: "小张"}, {id: 2, name: "小李"}, {id: 3, name: "小孙"}, {id: 1, name: "小周"}, {id: 2, name: "小陈"}, ];let obj = {};let peon = person.reduce((cur,next) => { obj[.原创 2020-08-28 11:58:42 · 1660 阅读 · 0 评论 -
小程序 弹出层 禁止页面滚动
解决办法:在弹出层上添加 catchtouchmove=’true’<view class="sh_Model_box" catchtouchmove='true'>...</view>注意:如果开发工具的模拟器上没有效果,真机测试,真机上有效果查看微信面试题小程序,面试更简单...原创 2020-08-08 11:35:55 · 731 阅读 · 0 评论 -
小程序 自定义弹窗后禁止屏幕滚动(滚动穿透)
弹出 fixed 弹窗后,在弹窗上滑动会导致下层的页面一起跟着滚动。解决方法:在弹出层加上 catchtouchmove 事件示例代码:<view class="modal-view" hidden="{{!showModal}}" bindtap="toggleModal" catchtouchmove="preventTouchMove"> <view class="modal"> <view class="modal-item" catchtap="mak原创 2020-06-12 09:45:03 · 1003 阅读 · 0 评论 -
金额输入限制 只能输入数字和小数点
金额输入限制 只能输入数字和小数点只需要设置 type=‘digit’ 即可<input type='digit' class='n-input' placeholder='请输入充值金额' bindinput="inputedit" adjust-position="true" value="{{moneyNum}}"/>您可以查看前端面试题小程序,大量面试题免费看...原创 2020-05-26 09:27:51 · 898 阅读 · 0 评论 -
阻止小程序事件冒泡的三种方法
1.直接用方法 :catchtouchmove=“preventD”<view class="selector-bj {{isTapSelector ? '' : 'is-focus-selector' }}" wx:if="{{selectorBj}}" bindtap='tapSeleBj' catchtouchmove="preventD"></view> //防止点击穿透 背景层 preventD:function(){ },2. 使用 catch 不用bin原创 2020-05-22 14:23:12 · 3685 阅读 · 0 评论 -
tabBar如何设置数字角标?
若是针对小程序可以:wx.setTabBarBadge({ index:1, text:'2'})查看前端面试题原创 2020-04-26 18:21:30 · 973 阅读 · 0 评论 -
输入延迟搜索
防止连续请求data{ newsetTimeout:null}method:{ // 输入搜索 changeinput(){ clearTimeout(this.newsetTimeout) this.newsetTimeout=setTimeout(()=>{this.getdatamdph()},500) },}体验前端面试题小程序...原创 2020-04-21 16:24:30 · 411 阅读 · 0 评论 -
小程序 真机运行环境加载失败(2,101),运行环境加载失败(1,4)
打开小程序提示,运行环境加载失败(2,101),运行环境加载失败(1,4)Efa2018-03-148781浏览问题模块: Bug反馈框架类型 操作系统 工具版本小程序 macOS 1.02.1802270Bug:预览版本与开发版本,无法进入,提示运行环境加载失败(2,101),运行环境加载失败(1,4)。ps:没有错误提示,这个问题每天都可能复现,然后第二天就好了,第二天开发测试用一...原创 2020-04-16 16:52:10 · 6551 阅读 · 0 评论 -
小程序util.js的使用
我们通过开发者工具快速创建了一个 QuickStart 项目。你可以留意到这个项目里边生成了一个utils/util.js这里写图片描述可以将一些公共的代码抽离成为一个单独的 js (utils.js)文件,作为一个模块;模块只有通过 module.exports 或者 exports 才能对外暴露接口。所以当你在util.js里封装的方法想要在外部使用的话,必须通过 module.exp...原创 2020-03-17 11:14:34 · 1295 阅读 · 0 评论 -
小程序云开发模糊查询
小程序云开发模糊查询尝试小程序云开发的时候发现小程序不能模糊查询,搜索得到如下办法;const db = wx.cloud.database(); //初始化数据库 db.collection("all").where({ // name: _name, name:{ $regex:'.*'+ 模糊匹配的值, $options: '...原创 2020-02-14 23:10:54 · 484 阅读 · 0 评论 -
微信navigate.ToMiniProgram 跳到其他小程序方法
在标签里设置app-id=“wx18a2ac992306a5a4” 为你的appid<navigator target = "miniProgram" app-id="wxc1032ERTRE3f9b4" path="pages/apps/largess/detail?accountId=2849563" open-type='navigate'> </navigato...原创 2019-12-18 15:29:13 · 883 阅读 · 0 评论 -
小程序用 rich-text长按复制事件
微信小程序的富文本编辑器 rich-text 没有提供长按出现复制剪切功能,下面是为大家提供的长按实现复制的简单功能,效果没有微信聊天页长按复制的效果好。1,在 rich-text 表签里添加 bindlongpress=“copy” data-text="{{nodes}}"<rich-text nodes="{{nodes[index]}}" class='ctext' bindlo...原创 2019-10-21 14:01:11 · 3003 阅读 · 2 评论 -
获取本月1号0时间 获取本周一的0点时间
// 本周周一时间 showWeekFirstDay(){ var nowTemp = new Date();//当前时间 var oneDayLong = 24*60*60*1000 ;//一天的毫秒数 var c_time = nowTemp.getTime() ;//当前时间的毫秒时间 var c_day =...原创 2019-07-08 11:56:30 · 2164 阅读 · 0 评论 -
js获取本周周一的0点时间
showWeekFirstDay(){var nowTemp = new Date();//当前时间var oneDayLong = 246060*1000 ;//一天的毫秒数var c_time = nowTemp.getTime() ;//当前时间的毫秒时间var c_day = nowTemp.getDay()||7;//当前时间的星期几var m_time = c_time - ...原创 2019-07-08 11:46:31 · 2418 阅读 · 0 评论 -
小程序toast组件中事件触发条件
微信小程序toast组件是一种消息提示框。例如当文章条数全部加载出来后,用户再次点击加载更多的时候,js判断文章条数全部加载出来后,便让toast组件弹出提示用户“没有更多文章了”,效果如下图所示:代码实现List itemindex.wxml1//点击加载更多,执行js里的loadMore函数2加载更多34//hidden接收js传递过来的toastHidden变量值,为true,...原创 2019-06-25 08:52:01 · 562 阅读 · 0 评论 -
Echart 使用
// var list = [1,1,54,5,5,85,8,8,5,5,8,8,85,8,8,5,5,85,88,85,8,88,8,8,8,8,88,]; //x轴的 时间// var list1= []; //温度数据// var list2=[] //湿度数据// function initChart(canvas, width, height) {// const c...原创 2019-05-28 15:07:16 · 4304 阅读 · 0 评论 -
小程序里英文和数字无法换行
加上这个句word-break:break-all;原创 2019-05-11 15:26:43 · 695 阅读 · 0 评论 -
小程序隐藏滚动条但还能继续滚动
小程序/隐藏滚动条/::-webkit-scrollbar { width: 0; height: 0; color: transparent;原创 2019-05-09 16:31:15 · 2095 阅读 · 0 评论 -
微信小程序地图控件Map的使用
本文介绍微信小程序map控件的使用map为原生控件之一……介绍完map控件之后下面直接来看代码怎么实现吧和往常一样,这些代码贴过去就可以直接通用的首先wxml文件(极简):<map id="map" scale="16" controls="{{controls}}" markers="{{markers}}" bindmarkertap="markertap" show-loc...原创 2019-07-04 08:52:00 · 11271 阅读 · 1 评论 -
小程序丨【已解决】position:fixed 有问题?
position:fixed 我用他定位了一个底部按钮,在安卓机上显示正常,但是在苹果上不显示,可以点到,开始以为是层级问题,我把他层级调高还是不好使.解决办法position:fixed;bottom:0;width:100%;height:150rpx;background:#fff;box-shadow: 0 0 20px #ccc;z-index:9999999...原创 2019-07-04 08:54:21 · 2812 阅读 · 1 评论 -
小程序自定义弹窗禁止底部内容滚动(滚动穿透问题)
小程序自带的弹窗比较简单,在实际项目中,我们往往需要自定义弹窗以满足较为复杂的业务需求。弹窗时底层内容一般都是不滚动,我们可以用下面几种方法实现:1、catchtouchmove=“true”可以实现弹框背景不滚动,但是也会导致弹框自身无法滚动,如果你的弹窗本身是不需要滚动的,用这个方法是极佳的。<view class="modal" catchtouchmove="true">...原创 2019-07-04 08:55:52 · 2444 阅读 · 0 评论 -
微信小程序隐藏tabBar
1、在app.json中的list内不能有非tabBar页面。简单说就是这个页面不要tabBar,那么tabBar也不要他了。{ "pages":[ "pages/index/index", "pages/logs/logs", "pages/reg/reg" ], "window":{ "backgroundTextStyle":"light", ...原创 2019-07-04 09:03:32 · 15392 阅读 · 1 评论 -
微信小程序遇到的问题
1.登录的流程:(1)wx.login获取临时登录凭证code.(2)wx.getSetting(OBJECT),wx.getUserInfo()获取用户的授权信息,并回传到开发者服务器code,encryptedData ,iv。(3)拒绝授权之后调用wx.openSetting,获取用户信息,向后台传信息。wx.getSetting({ success: (res) => {if...原创 2019-07-10 09:05:14 · 359 阅读 · 0 评论 -
小程序图片转Base64
在小程序中,有些业务要用到 图片的 base64wx.chooseImage({ success: res => { wx.getFileSystemManager().readFile({ filePath: res.tempFilePaths[0], // 选择图片返回的相对路径 encoding: '...原创 2019-08-08 17:37:00 · 245 阅读 · 3 评论 -
解决微信小程序使用switchTab跳转后页面不刷新的问题 微信小程序点击tabBar刷新页面
微信小程序点击导航栏菜单tabBar第一次的时候页面内容会刷新,那是因为调用了onLoad函数,但是点击其他菜单页再次返回第一点击的页面,页面无刷新,我的解决方法就是调用onShow函数:onShow: function(){var that =this;wx.request({url: app.globalData.web_url+'yourApi?open_id='+ wx.g...原创 2019-08-20 09:05:28 · 7104 阅读 · 8 评论 -
JS将时间戳转换为刚刚、N分钟前、今天几点几分、昨天几点几分等表示法
使用Javascript语言,将时间戳转换为类似新浪微博的时间的表示方法。 要求转换规则: 1分钟以内显示为:刚刚 1小时以内显示为:N分钟前 当天以内显示为:今天 N点N分(如:今天 22:33) 昨天时间显示为:昨天 N点N分(如:昨天 10:15) 当年以内显示为:N月N日 N点N分(如:02月03日 09:33) 今年以前显示为:N年N月N日 N点N分(如:2000年09月18日 15:5...原创 2019-08-20 11:21:11 · 1045 阅读 · 0 评论 -
小程序解析富文本html内容
读取数据库的内容时突然跳出"、、 "这些HTML标签、字符,吓一跳;本来如果是写HTML、JS倒也没什么,但是写小程序事时,小程序中是没有这些html标签的第一种方法:只能处理简单的HTML标签,img解释不了,连“ ;”也处理不了,好处就只有一方法 代码少,无须引入文件。在 app.js 添加以下方法代码,作为公共方法,所有页面都可用convertHtmlToText: f...原创 2019-08-30 10:06:40 · 864 阅读 · 0 评论 -
小程序svg图标的转换使用
原创 2019-04-13 15:59:07 · 953 阅读 · 0 评论