- 博客(43)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 vue3官方文档学习心得
2、最大的一个亮点是组合式API的使用，能更好的复用代码逻辑；23年写过一个vue2的项目，24年写了一个vue3的项目，页面功能比较简单，用几个简单的API，watch、watchEffect、ref、reactive就能实现的业务功能。写了几年的react的，初上手vue时对比着用再翻翻别人的代码，点对点的翻阅一下官方文档，能解决大多数的问题。1、双向数据绑定 v-model，还有一些其他指令 v-show、v-if、v-for、v-html、v-bind（：）、v-on（@）
2025-07-08 22:13:01
805
原创 从设计到开发一个小程序页面
巧妇难为无米之炊，想写功能但是没有好看的设计，边写边设计效率又不够高。mastergoAi生成的页面又不够好看，而且每月给的免费积分用得又超快，so决定自给自足。能有多难，先做，做了再改。先去小红书上找找模子，看能否复原。摸了一晚上，感觉效果还行，比ai生成的要好看那么一点。只是想画个时钟出来不知道怎么画好，还的看怎么用canvas实现时钟动画。今天用canvas绘制了时钟，然后调整了下整体的布局更简洁直观了。另外再附上canvas绘制时钟代码，canvas越写越有意思了。有了UI页面画起来就是快多了。
2025-06-30 20:19:09
413
原创 微信小程序实现简版点赞动画
第一阶段实现竖向曲线移动、点击添加绘制元素；下一阶段讲方块替换为图片。接下来的问题是canvas绘制的图片有锯齿，找了下解决办法：清晰多了。这是第二次写canvas，基于微信小程序文档demo进行改写。由于找不到透明背景的切图，为了美观想给图片画个圆。目前只能加个边框，裁剪还不能多个同时裁剪。demo效果为方块横向来回循环移动。点击效果可以查看小程序打卡模块。
2025-06-28 11:20:26
250
原创 微信小程序canvas实现抽奖动画
本来想用setdata做抽奖动画的，但是存在合并更新以及性能问题，遂采用canvas的形式。参考了一篇blog，然后加了些抽奖逻辑的改动。
2025-06-19 19:56:42
252
原创 原生微信小程序开发踩坑记录
page的onLoad里才能获取，component的生命周期里没法直接获取，所以需要再包一层page来获取跳转url里的参数。3、wxs里正则有不一样的使用方法，注意使用getRegExp，以及不要开头结尾的//；.wxml结构，主要是一个宽的的设置，movable-area 和 movable-view 都要设置宽度。小程序还是多年前用taro开发的，原生开发还是第一次。2、component获取url里的参数。1、父组件调用子组件的里的方法。4、wxs公共方法的使用。tool.wxs文件定义。
2025-06-16 23:07:38
212
原创 iframe的一些问题
如若结合以上两段代码，在父页面post message，父页面和子页面都可以监听到；同样，在子页面postmessage，父页面和子页面都可以监听到。这里实验了百度ai提供的代码，以及网友实践的代码。目前实验结果，可以互相通信；但是同一父页面，只能进行单向通信；非同源获取cookie都报错，更何况存入cookie。要么子页面post message，父页面监听。这里明天来实验，暂时没有有非同源的页面来实验。要么父页面postmessage，子页面监听。结合两段代码，父子互相传。
2024-11-26 11:40:25
649
原创 indexed的使用
那么就来总结下 cookie、session、localstorage、indexdb的容量问题。使用插件localforage，api和localstorage没大的区别，主要就异步操作。今天碰到了localstorage容量不够用的问题；改用indexdb来扩容；
2024-11-25 17:58:00
218
原创 vue3实践踩坑总结
疑惑：组件级 在template下写多个节点，没问题；页面级组件写多个会出问题；2、echarts 图表能展示，但是tooltip，图例点击失效；1、切换 页面 空白无报错信息；刷新 页面又能正常展示；3、mapbox加载pbf文件正确，但是文字不展示；原因：设置特殊字体，但是又未加载字体文件；原因：template 里写了两个节点；解决办法：使用默认字体，或者加载特殊字体。解决办法：实例化时 用 markRaw。解决办法：写到一个节点底下去。
2024-11-15 16:02:11
330
原创 前端布局，y轴超出滚动、x轴超出展示方案
想要实现布局效果，红区高度固定可滑动可收起。createPortal 红绿区数据流动不受影响。但是效果并不好，绿区直接隐藏了。
2024-10-16 10:40:13
494
原创 mapbox绘制实践
k8s新司用的这个开源部署网站平台，刚来时一直听说这个，但是直到现在为了配置nginx才正正经经地百度了下什么是k8s。map.setPaintProperty('图层ID','key','value')不支持rgba设置透明度，支持line-opacity设置整个图层透明度。前司一直用的自研的平台，内核是啥，也没关注过。1、new mapboxgl.Popup 的两种绘制方式。同一图层不能同时支持，实线 和 虚线。2、mapbox画虚线。
2024-08-19 15:32:26
397
1原创 websocket 初识
在WebSocket API中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。4.3服务器推送技术：WebSocket 提供了一种替代传统服务器推送技术（如 AJAX 长轮询、Comet）的方法，能更高效地利用网络资源。4.1即时通信：WebSocket 可以实现客户端和服务器之间的全双工通信，适用于需要实时交互的应用，如聊天室、在线游戏等。4.2实时数据流：WebSocket 可以用于服务器端向客户端推送数据流，比如股票价格变化、体育赛事结果更新等。
2024-06-26 17:41:07
327
原创 关于mapbox的一些学习
添加图层/删除图层/添加图片/删除图片/修改图层层级/图层显隐。“天地图”是国家测绘地理信息局建设的地理信息综合服务网站。"GeometryCollection"：几何集合。"FeatureCollection"：特征集合。GeoJSON是一种对各种地理数据结构进行。"MultiLineString"： 多线。"MultiPoint" ： 多点。"MultiPolygon"：多面。"LineString"： 线。"Feature"：特征。"Point" ： 点。"Polygon"：面。
2024-06-14 17:57:48
803
原创 一次报错排查的记录
然后加了个 console.error(e) 后，再运行找到真正报错的地方。4、然后去问了下大神，大神说这个错误不用管。所以我找了半天的解决方法，方向都不对。1、接口数据返回了，但是页面没有渲染。3、然后着手找解决方案，然而都没啥用。2、查看控制台，只有这一个报错。
2023-10-09 11:38:01
145
原创 富文本展示
情景：接口返回一段富文本，要求在页面正常展示该富文本内容：一大串节点字符串类似： “<strong><p>title</p></strong><p>一、大纲</p>”方法：<div className="rule" id="rule"></div>document.querySelector('.rule').innerHTML =data;...
2020-12-01 16:02:56
616
原创 mobx学习
1、create-react-app想写个mobx的小demo用create-react-app先搭建一个小应用文档：https://www.html.cn/create-react-app/docs/getting-started/按照入门引导，执行下面这个命令就可以新建一个react小项目了npx create-react-app my-appcd my-appnpm start这是初始目录，比较常见的。serviceWorker顺便提一下，控制页面缓存的，离线可访问.
2020-10-14 18:13:30
302
原创 常用各height的区别
1、offsetHeight元素实际占用高度offsetHeight = border+padding+height2、clientHeightclientHeight = padding+ height - 水平滚动条高度 (如果存在)来计算3、scrollHeight包括由于溢出导致的视图中不可见内容。scrollHeight的值等于该元素在不使用滚动条的情况下为了适应视口中所用内容所需的最小高度。没有垂直滚动条的情况下，scrollHeight值与元素视图填充所有内容所..
2020-10-12 19:45:54
917
原创 react native 键盘遮挡输入框的问题
1.在写react native时会碰到弹起的键盘遮挡住输入框的问题官网给出了解决方案：https://reactnative.cn/docs/keyboardavoidingview#docsNavkeyboardavoidingview可以解决这个问题需要给参数behavior={"position/height/padding"}keyboardVerticalOffset给值一般是给键盘的高度2.rn获取键盘高度方法import { Keyboard } from 'rea
2020-10-09 17:11:08
1338
原创 js滑动页面时，平滑过渡，示例
setScrollTopSmooth(end, time?){ const start = this.getScrollTop(); const val = end-start; const times = time ? time/10 : 30; const step = Math.floor(val/times); if(Math.abs(val)>2){ const timer = setInterval(()=>{ .
2020-09-22 21:21:04
886
原创 关于source-map
一直听同事说sourc-map，但是一直没看，今天就找了些资料看了下1.source-map是干什么的就是一种debug工具参考http://www.ruanyifeng.com/blog/2013/01/javascript_source_map.html2.source-map如何使用（配置）看了下项目工程中webpack配置有这样的 devtool: 'cheap-module-source-map',有这样的 devtool: 'eval-source-map'怎..
2020-07-23 11:18:16
500
原创 npm i 时多次报fsevent的问题
很奇怪npm i 时多次遇到报fsevent的问题，x-code什么的，可是这个项目完全和x-code没关系的。xcode-select: error: tool 'xcodebuild' requires Xcode, but active developer进根目录这么设置，突然就好了。xcode-select --print-path/Library/Developer/CommandLineTools➜ / sudo xcode-select --switch /App.
2020-05-29 15:18:37
2370
原创 rn0.59.9安装包过程中的问题
> [email protected] install /Users/chenghuiping1/Documents/allProjects/compony/frontend_rn/node_modules/sane/node_modules/fsevents> node-gyp rebuildxcode-select: error: tool 'xcodebuild' requir...
2020-02-10 23:41:20
313
原创 rn的webview遇到的问题
1.开始我拿个view把webview包起来，怎么都加载不出来页面，以为是别的问题，结果去掉就好了。应该是外部view没给到对的样式，，写的时候要注意下，和react写起来的习惯不一样。2.加载有的页面报下面这个错误。解决办法：参考这里的：https://www.cnblogs.com/jkr666666/p/10571878.html...
2019-11-04 14:49:05
491
原创 xcode拉取大文件时，报错
1.第一次是因为sshkey，需要进行配置；2.第二次，git lfs checkout ,就好了。ssh文件，本地的还在，没删掉。
2019-11-01 16:34:53
198
原创 npm报错
npm 报错npm ERR! Cannot read property 'match' of undefined解决方法：删掉package-lock.json文件，再重新npm install参考：https://blog.csdn.net/Jane_96/article/details/81451759
2019-10-31 14:00:21
263
转载 git 报错
git 报错remote: Compressing objects: 99% (31110/31111)remote: Total 10568 (delta 1611), reused 9639 (delta 682)fatal: pack has bad object at offset 259777253: inflate returned -5fatal: index-pa...
2019-02-25 14:27:34
1854
转载 webpack配置出的问题
1.Tapable.plugin is deprecated. Use new API on `.hooks` insteadhttps://blog.csdn.net/u011215669/article/details/81269386 2、Plugin/Preset files are not allowed to export objects, only functions...
2018-12-20 16:37:34
291
转载 小程序滑动穿透问题
1.如果弹出层没有滚动事件，就直接在蒙板上加catchtouchmove="move" move:function(){};2.如果弹出层有滚动事件，那么在弹出层出现的时候给底部的containerView加上一个class {position：fixed}，弹出层消失的时候移除。 https://segmentfault.com/q/1010000011134345...
2018-11-28 15:14:28
324
转载 css根据手机屏幕宽度调整样式
nav{font-size:16px;}@media screen and (min-width:320px){/*当屏幕宽度大于等于320像素,nav的字体改为14，这种方法不用刷新的，自动判断的，但必须要写在原本样式下面*/ nav{font-size:14px;}}/*同理*/@media screen and (max-width:320px){/*宽度小于等于3...
2018-10-15 20:25:22
5219
转载 React、React.js、React Native的区别
React（基础框架）：React 是基础框架，是一套基础设计实现理念，开发者不能直接使用它来开发移动应用或者网页。React.js（web网页开发）:在React框架之上，发展出了React.js 框架来开发网页。React Native（移动端应用）：在React框架之上，发展出来React Native 用来开发移动应用。作者：壹点微尘链接：https...
2018-10-14 21:29:19
2661
转载 css动画、变形、过渡
1.animation动画定义和用法animation 属性是一个简写属性，用于设置六个动画属性：animation-name 规定需要绑定到选择器的 keyframe 名称 animation-duration 规定完成动画所花费的时间，以秒或毫秒计 animation-timing-function 规定动画的速度曲线 animation-delay 规定在动画开始之前的延迟...
2018-10-14 19:04:19
259
原创 sublime text 3安装emmet插件
想通过package control安装但是就是不成功，所以采用了手动安装先下载emmet,附上地址https://github.com/sergeche/emmet-sublime/archive/master.zip下载后将文件解压到文件夹最后重启sublime text 3就可以啦亲测可行
2017-05-10 16:01:53
446
原创 npm包管理工具
1.npm install -g forever把forever包安装在全局路径下npm install forever2.npm root -g查看全局包安装路径3.npmconfig set prefix "d:\node"修改全局包安装路径4.npmlist查看当前目录下所安装的包5.npmlist -g查看全局包安装路径下的所有包6.npm un
2017-04-11 10:31:36
388
转载 数据结构线性表
最近在看大话数据结构，刚看完第三章的内容线性表主要有两种结构顺序存储和链式存储顺序存储结构(数组实现)查找的时间复杂度为O(1)，插入删除的时间复杂度为O(n)单链表查找时间复杂度为O(n),单链表在找到某位置的指针后插入删除的时间为O(1)根据以上特性，在查找操作频繁的时候优先先用顺序存储；在插入删除操作频繁的时候优先选择链式存储分别对应java里面的ArrayL
2017-03-16 20:35:27
407
原创 jade模板引擎基础
javascript流行的模板引擎：Mustache,HandleBars,Juicer,Xtemolate,EJS,Jadejade的安装npm install jadejade现在已经更名为pug 安装改为 npm install pugjade 文件编译>jade -P -w index.jade可选参数：-P 友好格式输出 -w 监测更改，实时编译sublime打开
2017-03-15 10:56:15
641
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人