- 博客(101)
- 收藏
- 关注
RSS订阅原创 vscode中开发微信小程序并使用sass开发需要安装的一些插件和解决class无法提示@import引入的全局样式问题
1.安装微信小程序开发的插件，我安装了这两个；那个好用各取所需，可以看人家的介绍，去测试看看2.安装sass相关插件，安装easy sass之后，ctrl+shift+p快捷键打开配置setting.json文件:// 对EasySass的配置，此段配置去掉则默认生成一个css文件和一个压缩的min.css文件 "easysass.formats": [ { "format": "expanded", //格式，expanded不压缩，compressed压缩 "e
2021-12-14 14:13:24
1463
1
原创 解决拉取历史消息并添加在聊天记录前面，页面滚动位置保持不变
微信小程序参考demo：https://developers.weixin.qq.com/s/qoE6INms7Pcj 规则：for循环设置有效的 key 值，key值最好是唯一的
2021-10-19 16:09:14
1865
原创 小程序笔记：scroll-view中设置了scroll-top为0置顶无效
场景：比如一个订单详情里面有评价输入区域，评价完成之后，重新获取订单详情接口页面的高度会发生一些改变，我们就要设置页面滚回到顶部标签：<scroll-view scroll-top="{{scrollTop}}" bindscroll="`bindscroll`"></scroll-view>data：scrollTop: 0, // 滚动到顶部oldScrollTop: 0, // 滚动位置滚动方法：bindscroll(e){ // 监听页面滚动 th
2021-09-23 11:34:40
1172
原创 vue 引入公共js，并使用（记录）
// js文件 apis.js export const httpUrl= "https://www.hao123.com/"; // 网站链接 //保存缓存数据export function storSet(name, object) { //把对象转成字符串 localStorage.setItem(name,JSON.stringify(object)); return localStorage.getItem(name);}//读取缓存数据export function s
2021-09-16 11:10:06
790
原创 2021-08-03 数组取值的一些操作（太难了，每次都忘记）
// 日期const date = new Date()let years = []let months = []for (let i = 1990; i <= date.getFullYear(); i++) { years.push(i)}for (let i = 1; i <= 12; i++) { months.push(i)}//根据值获取数组中该值的下标let yIndex= years.findIndex((item)=>item == 2021)
2021-08-03 15:08:23
145
原创 数组根据下标移除项，并生成新的数组
var index = 2;//某下标//筛选出下标不相同的项，组成新数组var arr = this.data.list.filter((item,ind)=>{ return ind != index})
2021-07-08 16:25:49
431
原创 rpx、px换算
rpx转px:let px = rpx / 750 * wx.getSystemInfoSync().windowWidth;px转rpx:let rpx = px * 750 / wx.getSystemInfoSync().windowWidth;
2021-06-28 11:11:57
281
原创 2021.06.18学习Git操作命令笔记
Git 保存的不是文件的变化或者差异，而是一系列不同时刻的文件快照1. git commit （提交记录）修改代码之后，记得提交代码哟！！2. git brach <分支名> （创建一个新的分支）3. git checkout <分支名> （切换到某分支）切换分支之后可将代码提交到当前分支，新的代码就会保存在当前分支之中4. git checkout -b <分支名> （创建分支并切换到该分支）同时创建分支并切换分支，非常nic.
2021-06-21 09:38:57
202
1
原创 vue全局引入scss样式文件
1.安装scssnpm install node-sass@4.14.1 --save-devnpm install sass-loader@7.3.1 --save-dev
2021-05-28 13:51:32
1706
原创 微信小程序scroll-view内的tab导航吸顶后，点击切换会闪烁问题
微信小程序scroll-view内的tab导航吸顶后，点击切换tab导航会闪烁问题原因是因为我加了下面这个属性，为了让点击之后滚动到相应位置能够平滑，现在是不能用了，不然tab导航会闪烁，去掉这个属性就可以了，官方文档：https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html...
2021-04-12 17:20:16
1330
原创 小程序自定义底部导航custom-tab-bar控制显示隐藏
参考网址：https://www.cnblogs.com/zjhblogs/p/14086327.html
2021-03-05 11:59:32
1002
原创 微信小程序点击左侧分类导航，当前选中的项滚动到分类导航中间
先看效果图吧（点击标题5自动滚动到中间）：我研究出最简单的做法，会有瑕疵，点击的项滚动到中间不是很正中间，原因是根据屏幕的高度定制滚动间隔个数，或者是每个分类项高度误差影响不是很完美，但是至少简单能用，自己调整就可以用了，上代码：1. shopCar.wxml<view class="container"> <!--左侧分类导航 ： 首先使用相对定位将导航固定在页面左边，如果有头部导航和底部导航的需要自己计算各个的高度再定位分类导航， .
2021-03-04 17:40:07
2431
2
原创 入职前端开发一年的感受
移动端实在是有点干不下去了，，，感觉被折磨的好累，我们公司的测试也是啥都不懂，什么都过来质问，烦。。。。。 pc端啥都不懂就开始质问。。。。。。。。真是烦人。。。
2021-01-23 17:40:59
1404
3
原创 jquery--点击a标签触发下载文件并触发子元素事件修改下载量加一
动态加载dom元素时，点击下载按钮触发下载，同时给下载量数量加一 for(var i in res.rows){ $(".content-box2 ul").append("<li>"+ "<div class='tit-box'>"+ "<div class='tit'>"+ "<p>"+ res.rows[i].fileName +"</p>"+ ..
2021-01-13 16:40:13
1538
原创 1rem等于100px移动端适配，适用所有机型（对华为有用）
我是复制人家代码单独写在一个js里面使用的，原博客：https://blog.csdn.net/qq_35499948/article/details/87972173新建resize.js文件 ，并放在public文件夹下的swiper文件夹（这个文件夹随便放的，只要是在public里面引入 问题不大）// 转化rem单位 1rem = 100px(function (doc, win) { var docEl = doc.documentElement, resize
2020-12-30 17:46:42
959
原创 vue使用element ui组件时刷新页面组件抖动
不管使用了什么组件，只要组件中使用了<i class="el-icon-arrow-down el-icon--right"></i>标签做图标，必须给它加上宽度，否则刷新页面总会感觉整个组件在抖动，感觉整个页面在抖动，其实不是，只要使用了图标的都会抖动，所以要给一个固定的宽度让它撑住，就算刷新页面图标闪烁也不会影响这个布局的抖动。一开始还以为是饿了么组件有毛病，原来是我疏忽了给图标固定的宽度或者高度。...
2020-12-28 20:01:48
2187
原创 vue 头像裁剪并上传（移动端h5公众号）
使用别人的方法改了一下，原文档：https://www.cnblogs.com/liangziaha/p/11962061.html 第一步先安装这两个插件 npm install cropperjs exif-js 第二步main.js引入裁剪插件（文件夹地址如上图） import clipper from '@/common/js/clipper';//图片裁剪插件Vue.use(clipper);//使用图片裁剪插件 第三步将插件的css样式写在App..
2020-12-21 15:24:06
442
原创 css制作类似优惠券的卡片样式（vue）
有点小瑕疵，勉强能用，安卓机使用下面的样式有缝，只能加了0.01、0.02的高度去缝，不完美半圆不圆，苹果机测试没问题。代码：<!-- 卡片详情 --><template> <div class="pages"> <div class="bg-img" :style="'background: url('+require('@/assets/images/biaozhi_kapian.png')+') no-repeat;background-..
2020-12-16 19:37:38
1843
原创 批量生成假数据（小程序）
某java大神教我写的测试假数据，批量三十条：var arr = Array(30).fill().map((item, index)=>{ return { "avatar": "", "content": "123456", "createTime": "1210", "goodsCommentPicList": [ { "id": index, ".
2020-12-10 15:48:34
606
原创 使用vue编写h5公众号跳转小程序
前言：我使用vue编写的h5公众号，实现点击小程序入口，打开小程序，微信官方文档：https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html要求：微信版本要求为：7.0.12及以上。 系统版本要求为：iOS 10.3及以上、Android 5.0及以上。跳转小程序主要的标签是 wx-open-launch-weapp第一步在vue项目下public文件夹下的index.html页面，引入微信配
2020-11-25 12:00:28
2361
4
原创 vue在ios手机上的一些问题（这次写的h5公众号）和后面补充的小程序问题
坑一：使用定位fixed，底部导航不显示，代码我就不写，总结就是定位套定位，心累代码太多不想贴；坑二：禁止页面放大缩小，解决：Vue 移动端禁止页面放大缩小_fuf_xyxnxss的博客-CSDN博客_移动端禁止放大缩小坑三：移动端h5页面禁止长按选择复制，解决：移动端h5页面禁止长按选择复制_艾欢欢的博客-CSDN博客坑四：苹果手机IOS点击输入框弹出键盘后，所有按钮点击位置上移，解决：苹果手机IOS点击输入框弹出键盘后，所有按钮点击位置上移_料峭春风吹酒醒，微冷， 山头斜...
2020-11-25 10:57:19
2004
14
原创 vue 定时刷新二维码，并定时检查是否扫描了二维码支付
问题：清除定时器是个坑，每次只清除了一个而已，返回上一页，其中一个定时器还在请求；原因：我没有在请求第一个定时器的时候优先清除第二个定时器，导致返回页面，第二个定时器还在执行请求，还有一个问题就是不知道是不是定时器需要循环清除，我也没去测试，就是用了循环，保险起见还是写了循环清除定时器，销毁。以下代码测试是没有问题的，问题不大先这么用着。<template> <!-- 支付二维码 --> <div class="page"> <!-- 引入
2020-11-19 17:30:39
3695
3
原创 数组使用符号分隔成字符串
//数组逗号顿号成字符串 var arr = []; for(var i in that.info.writeoffGoods){ arr.push(that.info.writeoffGoods[i].goodsDetails); } that.goodsName = arr.join('、');
2020-11-17 13:43:52
1045
原创 vue拨打电话功能实现
<a :href="'tel:' + serviceCall">呼叫</a>serviceCall表示电话号码直接使用a标签跳转到手机拨号
2020-11-17 09:30:46
1663
3
原创 小程序-多图上传和视频上传（优化版2.0，添加压缩功能）
项目中需要一次多图上传和视频上传就封装了一个简单通用的js 使用很简单复制一下代码粘贴到一个空的js，我命名为chooseUpload,将这个文件放到项目文件夹名称为utils中，没有这个文件夹可以自己新建一个 js代码如下： const App = getApp();//多图上传图片 、 单个上传视频const uploadInit = function(){ var up = uploadInit.prototype;//给方法添加属性 //选择上传方式 up....
2020-11-03 11:48:33
1001
1
原创 小程序 数组列表限制选中数量，是否选中、反选
前提：可以默认选中几项、没有选中的点击提示信息、取消已经选中的项html：active为选中的样式类名，isActive为true就展示选中的样式，反之不变<text wx:for="{{serviceList}}" wx:key="index" class="{{item.isActive?'active':''}}" data-index="{{index}}" bindtap="btnClick">{{item.name}}{{count}}</text>js：.
2020-08-27 17:19:48
1064
1
原创 小程序 做一个假数据搜索，输入值查出列表中所有匹配的数据
var list = [ { code: "370400", name: "枣庄市" }, { code: "430800", name: "张家界市" }, { code: "130700", name: "张家口市" }, { code: "620700", name: "张掖市" }, { code: "140400", name: "长治市" }, { code: "350600", name: "漳州市" }, ..
2020-08-27 11:52:48
761
原创 微信小程序 星级评分（例如店铺小数点评分）
示例：首先准备三种不同的星星图片，满星、半星、空星的；示例代码：比如评分是小数点 4.8分，就根据相应的判断显示内容，乘以10好取余；接口返回的字段名称替换4.8就欧了；<block wx:for="{{5}}" wx:for-index="index2" wx:key="index2" > <!-- 满星 --> <icon wx:if="{{4.8 >= index2+1}}" class="icon" style="background:.
2020-08-21 16:14:39
2260
原创 pages/share/share.json 文件不是 UTF-8 格式（微信小程序）
pages/share/share.json 文件不是 UTF-8 格式真是够了！！！也不知道怎么就报错了！小程序真的是坑，啥都没动自己改了语言格式~~解决文件报错的办法：点击微信开发者工具右下角位置，选中通过编辑保存，选中UTF-8 utf8，就可以解决了这个问题！！！同理：使用别的开发工具写小程序时，实例HBuilder:选择右下角语言UTF-8格式就可以了...
2020-07-24 10:40:37
5366
7
原创 scroll-view 横向滚动导航（小程序）
制作一个横向滚动的分类导航<scroll-view scroll-x="true" class="scroll-wrap"> <view class="tab-wrap"> <text wx:for="{{10}}" wx:key="index" class="tab-box {{isTab == index ?'p-fontcolor22':'p-fontcolor10'}}" data-index="{{index}}" bindtap="tabClick"
2020-07-21 10:43:35
724
原创 使用css样式，制作表格（小程序）
效果图：wxml:<view class="table-wrap"> <view class="table-box p-flex4 p-fontcolor13" wx:for="{{4}}" wx:key="index"> <view class="left">商品名称</view> <view class="right">360行车记录仪 G300高清夜视360行车记录仪 G300高清夜视360行车记录仪 G300高清..
2020-07-16 15:15:33
1331
2
原创 微信小程序 点击删除按钮，输入框失去焦点清空值
由于失去焦点，键盘回落没有及时触发清空，从而发现需要点击两下删除才清空，解决办法就是用定时器延迟触发清空
2020-06-24 13:54:42
3199
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人