- 博客(84)
- 资源 (4)
- 收藏
- 关注
RSS订阅
原创 Grid 网格响应式布局教程
它将网页划分成一个个网格，可以任意组合不同的网格，做出各种各样的布局。以前，只能通过复杂的 CSS 框架达到的效果，现在浏览器内置了。相对于，Grid 布局则是将容器划分成"行"和"列"，产生单元格，然后指定"项目所在"的单元格，可以看作是二维布局，在某些使用场景下，会比flex布局更便捷一些。
2022-09-29 13:03:58
1482
1
原创 vue3+element+sortablejs实现table动态拖拽
vue3+ts+element使用sortablejs完成table动态拖拽
2022-07-13 16:07:10
3205
原创 小程序mqtt实现聊天功能
mqtt是什么？MQTT是一个轻量级传输协议，它被设计用于轻量级的发布/订阅式消息传输，MQTT协议针对低带宽网络，低计算能力的设备，做了特殊的优化。是一种简单、稳定、开放、轻量级易于实现的消息协议，在物联网的应用下的信息采集，工业控制，智能家居等方面具有广泛的适用性。谁发布，谁订阅？MQTT服务器类似一个公告栏，里面张贴了各种广告。张三跑过来说，凡是涉及足球的（/public/TEST/Soccer）的都发给自己（订阅）第二天，李四过来贴广告了，主题是（/public/TEST/Socc
2021-06-28 10:08:17
4415
1
原创 Charles（茶壶）的使用
CharlesCharles是一个HTTP代理/ HTTP监视器/反向代理，它使开发人员能够查看他们的机器与Internet之间的所有HTTP和SSL / HTTPS通信。这包括请求、响应和HTTP报头(其中包含cookie和缓存信息)。Charles的常用功能 抓包 修改网络请求参数和响应结果 重定向网络请求 模拟慢速网络，2g、3g、4gCharles官网地址https://www.charlesproxy.com/功能使用抓包开启http抓包Proxy -> m
2021-04-06 18:07:42
2100
原创 小程序文本框悬浮软键盘之上
效果：方法很简单接下来给大家详细讲解,input获取焦点时,可以拿到软键盘的高度,那么问题就好解决了我们只需要拿到这个高度去给input写一个动态的定位样式即可<view class="inputBox" style="bottom:{{bottom}}px">//行内动态绑定样式 <input class="input" ...
2019-08-22 14:29:52
3374
1
原创 正则过滤替换特殊符号
item.content.replace(/\r?##/g, "")将文本内"##"替换为" "空字符串const app = getApp()Page({ list: [ { content: 'Miji米技便携果汁机(手携按压式)##MB-1200######市场参考价：498元/套######装箱：8套/箱######品牌：Mij...
2019-08-02 10:20:35
1777
原创 小程序富文本渲染HTMl标签添设置样式
平时我们用到富文本渲染的时候有一个问题会让我们无从下手，如何给富文本大字符串里的标签添加class样式去控制呢，小编今天教大家一种简单通过的方法；首先我们是用官方自带的富文本渲染标签 <rich-text nodes="{{content}}" bindtap="tap"></rich-text>然后我们下一步进行对富文本进行下一步操作添加class样式...
2019-07-01 13:54:36
8146
4
原创 微信小程序scroll-view锚链接跳转
效果：wxml代码（直接给大家上代码吧，没有太复杂的逻辑）<view class="container"> <scroll-view class="content" scroll-into-view="{{toView}}" scroll-y="true" scroll-with-animation="true"> <view w...
2019-04-26 16:47:17
925
原创 微信小程序转码百度小程序
其实很简单的，相似度本身就很高下面开始教大家怎么转码1,首先你要下载百度小程序IDE(最新版本) 点击代码搬家2,选择你要转码的微信小程序目录3,选择你百度小程序的目录（空目录）用来保存转码后的代码4,最后一步 开始转码 即可 appid可以不填写，根据代码会有一些小小的瑕疵,需要进一步略微的二次开发，希望能帮助到大家记得关注小编噢！！！喜欢上方小...
2019-02-21 09:26:12
7480
原创 小程序代码转码oppo快应用
现在安卓手机厂商推出了自己 快应用 基于手机桌面类似小程序。今天给大家讲解开发过程中的坎坷经历，首先我们是熟悉了oppo快应用文档，类似于vue语法+小程序api的模式，跟uniapp感觉有相同之处，但是在开发过程中，感觉各方面生态还不是特别成熟，包括开发者工具，文档API及组件及社区都没完全成熟起来。开发起来一步一个坑，所以放弃原生开发，想法直接走捷径。转折点转换工具介绍文档：https://www.npmjs.com/package/qa-adapter当我们开发正出入水深火热之中时，对接技术小
2023-06-20 16:55:54
187
原创 微信小程序onShareAppMessage分享
onShareAppMessage是实现微信小程序分享功能的方法;先给大家来一个例子：Page({ //分享页面 onShareAppMessage: function () { var that = this; return { title: '分享页面', path: '/pages/index/index?id='+that.dat...
2023-06-20 16:53:05
6421
7
原创 小程序瀑布流布局
<!-- 瀑布流 --> <view style="display:none"> <!-- 获取图片尺寸信息 --> <image wx:for="{{loadList}}" wx:key="id" id="{{item.recipe.id}}" src="{{item...
2023-06-19 16:02:46
144
原创 Vue项目iconfont新增svg图标
最近接手一个开发一半的Vue3的后台管理项目，由于样式需要，需要新增一些svg图标，项目使用的是iconfont接下来我会通过几个步骤在原来iconfont基础上去新增一些自己的图标；
2023-05-30 16:57:12
1626
原创 vue3.0项目快速搭建
如何搭建一个vue3.0基础项目？一、我们要确保vue/cli版本在4.5.0以上，才能更好的支持3.0//安装最新vue/cliyarn global add @vue/cli //或npm install -g @vue/cli用vue -V查看安装的版本号检验是都成功安装。二、通过vue/cli3创建我们的第一个项目vue create your-project ? Please pick a preset: (Use arrow keys) default (babel
2021-12-20 16:39:41
1892
1
原创 html2canvas实现指定文档元素截图
html2canvas使用时，有一种场景，我们截图的时候有些元素我们不需要保留，所以文档中就提到了一个属性。html2canvas文档https://www.pianshen.com/article/641826799/文档上写清楚了 ignoreElements可以遍历元素删除匹配的元素，接下来就讲一下两种使用方式。使用方式一<div class="btn">点击截图</div> <div id="targetDom" class="main">
2021-05-17 14:58:30
1851
原创 公众号授权用户信息
公众号的code其实前后端都可以获取这个可以根据实际情况去决定第一步：用户同意授权，获取codelet appurl = document.URL;let encodeUrl = encodeURIComponent(appurl)let url = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + base.wxAppID + '&redirect_uri=' + encodeUrl + '&respons
2021-03-10 10:43:45
468
2
原创 Charles抓包配置教程
一、设置代理第一个我们设置为*代表抓区所有433代表我们可以抓https协议的接口二、下载配置证书地址: https://www.charlesproxy.com/documentation/additional/legacy-ssl-proxying/下载过证书之后,请选择始终信任三、开始抓包我们直接用电脑打开我们想请求的页面即可以上我们就可以实现我们要的功能了喜欢上方小程序,需要源码的,私信小编留下邮箱。...
2021-03-08 11:00:03
360
原创 git初始化项目
平时我们想将本地代码提交并生成git项目,以下几个步骤即可完成步骤一:如果本地代码里有以关联仓库,我们 command+sheft+.查看隐藏文件并删除git文件.步骤二:删除git文件之后,我们执行 git init 初始化本地项目,你会发现又出现一个git文件夹.步骤三:初始化之后,我们执行 git remote add origin xxxxxx(远程仓库地址) 创建远程仓库并建立关联.步骤四:建立好关联之后,其实就跟我们平时提交代码的操作一样了git add .git commit
2021-03-02 13:32:56
1390
原创 CSS竖行横书组合
horizontal-tb：水平方向自上而下的书写方式。vertical-rl：垂直方向自右而左的书写方式。vertical-lr：垂直方向内内容从上到下，水平方向从左到右。sideways-rl：内容垂直方向从上到下排列。使用方法div { writing-mode: vertical-rl;}<div> <p>同在屋檐下，</p> <p>惟有偶遇。</p> <p>犹如白驹过隙，</p>
2021-02-24 16:49:19
133
原创 免费api查询接口
为了方便广大的开发者，特此统计了网上诸多的免费API，为您收集免费的接口服务，做一个API的搬运工，以后会每月定时更新新的接口。有些接口来自第三方，在第三方注册就可以成为他们的会员，免费使用他们的部分接口。地址: https://github.com/fangzesheng/free-api喜欢上方小程序,需要源码的,私信小编留下邮箱。...
2021-02-24 14:51:29
686
原创 微信小程序onShareAppMessage分享
onShareAppMessage是实现微信小程序分享功能的方法Page({ //分享页面 onShareAppMessage: function () { var that = this; return { title: '分享页面', path: '/pages/index/index?id='+that.data.id, } }})title:是我们分享出去页面的标题,path:是我们分享页面的路径,平时我们分享是会遇见一些问题
2021-02-24 14:41:34
1046
9
原创 vue项目install node-sass报错解决方案
小编也是最近遇到得一个坑，因为换了台电脑，从新拉下来得代码install就报错npm run dev 也会报错如下小编也是百度好久终于知道了问题得所在，是因为node-sass版本较低找不到node-sass里得一个文件，那么解决办法就来了，先把node_modules包给删除了，然后在项目目录下cmd 把node-sass给配置一下最新版本npm i node-sass -D 配置好以后我再在进行cnpm install 这样项目配置下来就不报错了接下来直接运行项目 npm run d
2021-02-22 13:54:36
868
1
原创 小程序修改上一页数据
需求是这样的A=>B页面,在B页面修改A页面data里的数据首先我们要使用 pgetCurrentPages() 方法获取当前页面栈,数组中第一个元素为首页，最后一个元素为当前页面A页面数据Page({ data: { name:'张三' },})B页面修改let pages = getCurrentPages();//当前页面let prevPage = pages[pages.length - 2];//上一页面console.log(prevPage)prev
2021-02-22 13:45:29
514
原创 秒数格式化为分秒
秒数格式化为分秒num 秒数return {string} 分秒function formatSeconds (value){ var secondTime = parseInt(value); // 秒 var minuteTime = 0; // 分 var hourTime = 0; // 小时 if (secondTime > 60) { minuteTime = parseInt(secondTime / 60); secondTime = pars
2021-02-20 15:49:54
471
原创 微信小程序swiper-显示多个item的内容(上一个,下一个)
效果:直接使用小程序的swiper组件就可以实现我们要的效果,但是我们注意swiper的高度问题,这是一个坑!先贴上代码<view class="swiper-box"> <swiper current="{{currentNum}}" bindchange='onChange' style='height:{{Hei}}' previousMargin="60rpx" nextMargin="60rpx"> <swiper-i
2020-10-20 17:17:02
5010
1
原创 vue keepalive 动态缓存页面
1,使用keep-alive标签<keep-alive> <router-view v-if="$route.meta.keepAlive"></router-view></keep-alive><router-view v-if="!$route.meta.keepAlive"></router-view>2,router配置缓存页面开关 { // 模板列表 path: 'temp
2020-07-28 20:00:32
1177
原创 vant上传图片
直接上代码了 <van-uploader :file-list="fileList" multiple result-type="file" :after-read="handleUpload" /> methods: { async handleUpload(event) { this.$loading.open('上传中') let { ro
2020-06-15 16:18:12
3048
3
原创 vue保存图片到本地
首先呢我们要，安装一下依赖；npminstallhtml2canvas--save接下来我们就直接上代码了 <van-tab title="签到二维码"> <div class="QRCode-box"> <!-- /static/images/QRCode-box.png --> <van-image src="/static/images/QRCode-box.png" /> ...
2020-05-22 15:19:53
11992
4
原创 vue-echarts实战开发
我们今天讲解vue-echarts的开发使用方法，我们先看效果；我们直接贴代码，对应效果会有注释。<template> <div class="echarts-box"> <div id="chart_example" style=' width: 420px;height: 300px;'></div> </div></template><script>import echarts
2020-05-22 13:56:18
732
原创 vue-router-link-active的作用
如图所示：我们跳转至对应页面就显示选中状态我们只需要定义.router-link-active的样式即可改变选中状态以上就实现了我们router-link-active给选中路由组件添加选中样式喜欢上方小程序,需要源码的,私信小编留下邮箱。...
2020-05-14 13:09:53
1269
原创 小程序代码转码oppo快应用
前言现在安卓手机厂商推出了自己 “快应用” 基于手机桌面的一种类似小程序。今天给大家讲解开发过程中的坎坷经历，首先我们是熟悉了oppo快应用文档，类似于vue语法+小程序api的模式，跟uniapp感觉有相同之处，但是在开发过程中，感觉各方面生态还不是特别成熟，包括开发者工具，文档API及组件及社区都没完全成熟起来。开发起来一步一个坑，所以放弃原生开发，想法直接走捷径。转折点...
2020-04-02 10:32:59
1027
3
原创 微信小程序腾讯云实时语音转写
需求:语音实时转换文字步骤1：首先我们要添加腾讯云智能语音插件步骤2：插件文档地址：https://mp.weixin.qq.com/wxopen/plugindevdoc?appid=wx3e17776051baf153&token=262289731&lang=zh_CN按照文档步骤我们首先要对app.json进行声明配置步骤3在开发之前...
2020-03-12 15:29:54
2530
4
原创 小程序setData直接修改对象数组得某一项
数组演示Page({ data: { arr:['小明','小张'] }, onLoad: function () { // 首先我们演示数组 this.setData({ [`arr[1]`]:'小李' }) console.log(this.data.arr) // ["小明", "小李"] }})当...
2020-03-10 09:09:15
467
原创 HTML给汉字头部添加拼音的标签
HTML Demo: <ruby><ruby> 汉字<rp>(</rp><rt>hàn zì</rt><rp>)</rp></ruby>如图喜欢上方小程序,需要源码的,私信小编留下邮箱。...
2020-01-06 14:47:25
1005
2
原创 async await 基本使用方法
直接贴代码了,自己去打印看效果就会懂 async function async1() { console.log(1); const result = await async2(); async3() } async function async2() { return new Promise((resolve...
2020-01-06 13:57:56
730
2
原创 微信小程序地图添加标记点
如图所示；<map id="map" longitude="{{longitude}}" latitude="{{latitude}}" scale="14" markers="{{markers}}" bindtap='onLocation' polyline="{{polyline}}" show-location style="width: 100%; height:...
2020-01-02 11:02:31
8867
6
原创 Vue表情包输入组件
地址http://npm.taobao.org/package/emoji-mart-vue;安装npm install --save emoji-mart-vue组件import { Picker } from "emoji-mart-vue"; //引入组件<template> <div class="container">...
2019-12-11 15:40:41
5099
3
原创 微信小程序点击保存图片到本机
1.首先我们要把想保存的图片绘制在画布上<view class='container'> <canvas style='width:{{canvasWidth}}px; height:{{canvasHeight}}px' class="canvas" id="canvas" canvas-id="canvas" disable-scroll="true">...
2019-12-11 09:56:52
4913
原创 微信小程序背景音乐开发
wx.getBackgroundAudioManager() 背景音乐wx.getBackgroundAudioManager()推荐大家使用背景音乐不在使用audioaudio播放音频加载时间长 体验需求达不到相关文档https://developers.weixin.qq.com/miniprogram/dev/api/media/background-audio/Bac...
2019-12-11 09:56:32
13007
23
vue-element-admin.zip
2021-02-20
食典瀑布流电商小程序模版
2020-10-22
axios.js脚本文件
2018-09-14
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人