- 博客(43)
- 收藏
- 关注
RSS订阅原创 分享几个开发中的漂亮的小程序组件
最近在开发一些微信小程序组件，全凭个人审美和想法目前，日历组件已经开源了，打成了npm包，可以直接在小程序中安装和构建，详细步骤可以参照以下地址的readme：wx-easy-calendar npm包地址接受建议，欢迎大家评价与讨论。日历组件：子组件与父页面间通信（接口都留好了）暗黑模式选择date-picker的日期选择swiper顺滑无缝切换日期弹出式modal模态栏信息填写（标题、心情等）（日历折叠功能在V1，V2中去掉了，感觉有点鸡肋）卡片组件：磨砂玻璃透明UI（可以
2022-05-15 18:33:24
490
原创 JS的执行顺序
微任务：Promise 、 process 、 nextTick宏任务：整体代码script 、setTimeout 、 setInterval通过代码来解释：setTimeout( ()=>{ console.log("timeout") })new Promise( (resolve, reject)=>{ console.log("promise") resolve()}).then( ()=>{ console.log("then") })conso
2022-04-30 15:13:10
449
原创 Vim 学习笔记
在windows下安装vim打开vim的官网，下载win版本：https://www.vim.org/download.php安装，一直右键即可检查vim是否已安装成功，及检查vim是否被添加到环境变量中vim -V 一直回车至此，vim安装成功Vim的一些配置vim中文乱码-编码格式设置vim看代码时会出现中文乱码，那是编/解码的格式不正确设置格式进入vim的配置文件vim ~/.vimrc 按i，切换到插入模式set termencoding=
2021-11-30 23:31:45
644
原创 mysql的下载安装
mysql1、下载：community版本，选择正确的版本https://downloads.mysql.com/archives/community/2、解压zip3、添加解压文件夹下的bin路径到环境变量中4、修改配置信息：添加数据库和数据位置解压文件夹下的my-default.ini5、打开管理员权限powershell，进入到bin文件夹目录cd E:\mysql-5.6.51-winx64\bin6、安装服务mysqld -install7、启动服务net start
2021-11-21 16:01:11
527
原创 Promise的详解，解决回调地狱
1、作用解决回调地狱问题2、Promise的参数Promise是一个构造函数，通过new关键字实例化对象接收一个函数作为参数在接收的 作为参数的函数 中，又接收两个参数：resolve 和 rejectresolve 和 reject 又是函数作为参数3、Promise的状态 ：statepending状态：准备、待决解、进行中fulfilled状态：已完成、成功rejected状态：已拒绝、失败4、状态的改变初始化的时候，当前Promise的状态：pendin
2021-06-20 18:03:10
476
1
原创 小程序日历组件的简单实现
一、需求显示当前月份的日期日期与星期对应二、实现1、布局结构2、布局实现container：用固定的宽高，宽度可以占满整个屏幕(100vw)header：高度固定，宽度继承，布局使用flex，字体居中，行高=高度；适当修饰：字体size，padding…left：布局flex=0.5right：布局flex=0.5middle：布局flex=2panel：高度固定，宽度继承，布局使用flex，字体居中，行高=高度；适当修饰：字体size，padding…day_ite
2021-05-30 21:16:22
382
原创 小程序自定义组件的methods的调用
自定义组件的methods的调用今天写了一个日历组件，只显示当月的日历。在methods中用了一些方法来this.setData({})，但是不知道怎么让组件在实例化的时候自动调用方法。后来查到组件有一套生命周期created 组件实例化，但节点树还未导入，因此这时不能用setDataattached 节点树完成，可以用setData渲染节点，但无法操作节点ready(不是onReady) 组件布局完成，这时可以获取节点信息，也可以操作节点moved 组件实例被移动到树的另一个位置d
2021-05-30 17:19:46
3686
原创 this的个人笔记
使用构造函数的方式创建一个函数，再用new的方式使用该函数，也是相当于创建了一个对象function User(name) { this.name = name; this.show = function () { console.log(this.name); function render() { // window对象 console.log(this); } render(); };}let xiaoming = new User('小明
2021-03-21 23:46:54
126
原创 数组的使用详解
普通用字面量来创建数组，直接往[]中添加元素let array = [1, { name: 'xiaomin', key: 12 }, 3, 4, 5];console.table(array);用构造函数的方式创建数组，会有个问题，就是只往 Array()中放一个元素时，会被当作创建数组长度来解析创建一个长度为 6 的数组，而不是创建一个长度为 1，元素为 6 的数组let array = new Array(6);console.table(array.length);新版的 js，给
2021-03-06 21:00:37
1329
原创 在行数(i)=列数(j)的范围内，求x[n,n]循环次数
在行数(i)=列数(j)的范围内，求x[n,n]循环次数。var num = 0;start:for(var i = 0; i < 2; i++){ for(var j = 0; j < 2; j++) { if(i = =1 && j == 1) { break start; } } num++;}alert(num);两层循环：可以列出一个矩阵：因为
2020-10-17 21:35:39
137
原创 electron安装教程
1、安装node.js 例如：安装在 F://node 下；2、cmd控制台:F: 回车，进入F盘，cd node回车，进入node文件夹，node -v回车，查看node版本，npm -v回车，查看npm版本，若出现版本号，表示安装成功；3、在cmd控制台，node文件夹下，把npm仓库切换到国内taobao仓库，速度会快很多，命令如下： npm install -g cnpm --registry=https://registry.npm.taobao.org
2020-10-17 21:30:27
3904
原创 微信小程序跳转问题
微信官方给出五个跳转API①wx.switchTab(Object object)跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面wx.switchTab({ url: '/index'})②wx.reLaunch(Object object)关闭所有页面，打开到应用内的某个页面wx.reLaunch({ url: 'test?id=1'})③wx.redirectTo(Object object)关闭当前页面，跳转到应用内的某个页面。但是
2020-10-17 21:26:47
519
原创 小程序云开发实现云数据库的增删改查 2019-03-16笔记
微信云开发对云数据库的增删改查-填坑之旅本次实操针对页面函数与数据库的对接，暂时与云函数无关初始化云数据库app.js中：App({ onLaunch: function () { if (!wx.cloud) { console.error('请使用 2.2.3 或以上的基础库以使用云能力') } else { wx.cloud.init({ //当前云环境ID env: "kurtery-00904xu
2020-10-17 21:23:06
188
原创 解决gitbash中 failed to push some refs to...问题
原因是本地readme.md与 GitHub 创建新repository时新建的 readme.md不一致解决方法：删除本地readme.md重新输入 git pull -rebase origin master 接着 git push -u origin master
2020-10-17 21:10:26
136
原创 vue+elementUI写几个漂亮UI页面
先上图，觉得好看的，从github拿源码吧~github地址 ：https://github.com/michaelxuzhi/oneNiceUIPage执行 npm i 之后，由于我添加了electron-builder，所以此项目可以build成网页版，也可以build成桌面应用。后续会补充完善成全响应式布局，并适当添加功能。敬请期待！...
2020-06-06 00:34:35
23393
9
原创 解决electron打包时，下载超时导致失败
一、在我使用vue-cli构建electron应用后，使用vue add electron-builder，添加打包工具，安装成功后，脚本中会多出两条命令：使用 npm run electron:serve 可以以桌面应用的形式打开所构建的vue项目使用 npm run electron:build 可以打包所构建的vue项目，生成exe格式的可执行文件，然后就可以安装使用了。二、但是打包的过程充满了艰辛。因为打包要使用到三个工具：electron-v9.0.2-win32-x64.zip 和
2020-06-05 13:26:53
5197
原创 在windows Terminal中添加git
首先打开windows Terminal，第一步点击顶部向下的小标，第二部选择设置选项。进入到settings.json的配置文件中。这是官方已经配置好的三个命令行窗口项，但是还没有git的，所以我们要自行添加git的配置信息，让git-bash可以使用windows Terminal。这些窗口项的配置信息都是以对象的类型存在，所以git的也一样，在Azure或者某一个配置信息后加上git的配置对象信息即可。接下来我会解释我配置的每一项。配置信息：“commandline” : “命令行
2020-06-04 22:10:26
4502
1
原创 去掉JSON对象的引号
接收到子窗口传递过来的JSON对象中的msg.data内容为： "这是子窗口传递过来的信息"现在我们需要引号中的内容，即去掉引号。做法：JSON.parse(JSON.stringify(msg.data))结果：
2020-06-03 12:47:58
3071
原创 解决了sublime3连接channel_v3.json超时或无法访问的问题
解决Sublime包管理package control 报错 There are no packages available for installation这是因为网络连接不上https://packagecontrol.io/channel_v3.json，所以造成了这样的问题，那么自行下载一个channel_v3.json即可。下载完毕后，需要记录文件位置。打开sublime，依次打开 Preferences -> Package Settings -> Package Contr
2020-06-02 09:34:14
896
原创 cnpm : 无法加载文件....因为在此系统上禁止运行脚本。
解决方法:① 以管理员身份运行power shell② 输入 set-ExecutionPolicy RemoteSigned③ 输入A，回车
2020-05-31 17:33:36
1474
原创 Vue组件化思想
如果将一个页面中所有的处理逻辑全部放在一起，那么处理起来会非常复杂混乱，而且不利于后续的管理以及扩展。如果将页面拆分成一个个小的功能块，每个功能块完成属于自己的独立功能，那么整个页面的管理和维护就变得容易了。一个页面可以分为多个组件，每个组件又可以细分Vue的组件思想①它提供了一种抽象，让我们开发出一个个独立可复用的小组将来构造我们的应用。②任何的应用都会被抽象成一棵组件树。一、注册组件的基本步骤组件的使用分为三个步骤创建组件构造器注册组件（全局注册、局部注册）使用组件
2020-05-21 21:42:29
2877
原创 V8引擎内存机制
内存大小和操作系统有关： 64位-1.4G 32位-0.7G64位系统下的新生代内存-64MB 老生代内存-1400MB32位系统下的新生代内存-16MB 老生代内存-700MB为什么限制内存大小？1、够用了，js设计的初衷是浏览器脚本语言，只执行一次，便释放内存2、如果不限制，回收一次100MB的内存大概花费3ms，V8引擎在回收垃圾时，是暂停住所有代码的执行，一旦垃圾过多，在回收内存的时候，中断的时间过长，体验不佳。新生代内存：保存新变量，存活时间短的老生代内存：保存老变量，存活时
2020-05-19 22:48:37
564
原创 JS的执行顺序
微任务：Promise 、 process.nextTick宏任务：整体代码script 、setTimeout 、 setInterval通过代码来解释：setTimeout( ()=>{ console.log("timeout") })new Promise( (resolve, reject)=>{ console.log("promise") resolve()}).then( ()=>{ console.log("then") })consol.
2020-05-19 18:34:04
328
原创 订阅者-发布模式/观察者模式-vue（旧）响应式原理
定义一个普通对象：houseObj 房子对象定义一个消息列表，房子的信息，list，待会儿会从消息列表中筛选出合适的信息发布。不用数组，是因为数组会把key当作索引处理，再去取里面的内容的话，会进行数组的深拷贝，增加性能负担，而使用对象就可以省去深拷贝listen，增加订阅者，（对房子的要求，key是对房型的规定，fn往下看是一个打印订阅者信息的方法而已）trigger，是发布消息最终是通过key来判断每个订阅者的需求，并进行正确的消息发布 let houseObj = {} .
2020-05-18 21:41:03
301
原创 js中将获取到的时间戳转化成正常格式
在开发过程中，绝大可能都会遇到请求服务器，服务器返回的时间数据是以时间戳的方式呈现的，这时候就需要我们将时间戳格式转换为我们生活中正常的时间格式。1、自己通过Date对象方法的形式拼接。①首先要将时间戳转换成Date对象，时间戳一般以秒为单位，所以在传给Date时，要乘以1000，如果返回的时间戳是毫秒级的，就不用乘以1000了。const date = new Date(时间戳*1000)②拿到Date对象，将此对象转换成对应得字符串。Date对象有对应的方法：以下列举的是比较...
2020-05-16 23:14:37
1277
原创 Vue中的事件总线bus
如果在跨级或兄弟组件中需要进行通信，多次使用$emit方法会显得繁琐不灵活该事件总线可以发射与监听事件，就像vue实例一般在main.js中将$bus加入到vue原型中Vue.prototype.$bus = new Vue()在某一组件A中，使用$emit来发射事件，一般用于数据更新的情况this.$bus.$emit("事件名")在另一组件B中，使用$on来监听事件，A中数据发生变化，B中可以监听到，再执行后续操作this.$bus.$on("事件名",function(){ 相关操作
2020-05-11 22:01:38
377
1
原创 vue组件之吸顶展示选项条
在开发移动端项目中，经常会使用到吸顶展示的选项导航如下图所示：而且此选项导航条在距顶部一定距离时，会固定住不再向上滚动分析一下：先创建一个tabControl.vue<template> <div class="tab-control"> <div class="tab-control-item"> <span>写...
2020-05-05 21:33:38
914
原创 一个vue底部导航栏组件
写一个底部导航栏独立组件，便于以后项目中的使用分为创建和封装两步需求：独立、图标可改、名称可改、flex布局①分析：首先是TabBarTabBar是导航栏的主框架，包裹整个导航栏创建tabbar -> Tabbar.vue<template> <div id="tab-bar"> // 这里啥都没有 </div>...
2020-05-02 17:33:21
2257
6
原创 vue cli3 路由懒加载lazy-load
首先安装vue-router:npm i vue-router -S在router文件夹下有个index.js文件，这是路由配置文件先引用：import Vue from 'vue'import VueRouter from 'vue-router'安装路由插件Vue.use(VueRouter)创建router实例对象const router = ne...
2020-05-02 11:57:04
749
原创 个人的.editorconfig的配置
root = true[ * ]charset = utf - 8indent_size = 2end_of_line = lfindent_style = spaceinsert_final_newline = truetrim_trailing_whitespace = true
2020-05-01 21:04:06
183
原创 vue cli3配置文件夹别名 alias
vue cli3配置文件夹别名-alias①创建 vue.config.js②进行配置module.exports={ configureWebpack:{ resolve:{ alias:{ '@' : 'src', 'assets' : '@/assets' '别名': '路径' } } }}...
2020-05-01 20:39:54
1124
原创 axios简介
当项目中需要使用到网络请求时，从原生ajax（基于XMLHttpRequest），jQuery-Ajax，vue-resource（已淘汰），再到现在的axios，有很多种方式可以选择。axios的优点在于： 在浏览器发送XMLHttpRequest请求。 在node.js发送http请求。 支持Promise。 可以拦截请求和响应。 转换请求和响...
2020-04-27 22:55:33
513
原创 数组高阶函数的使用
1、filter(callbackfunction( ){ })回调函数返回的是 boolean 值，true: 将元素存入一个新数组中，false: 丢弃该元素例： data:[10, 20, 100, 140]需求：选出其中小于 100 的元素，并赋值给新数组 dataNum:[ ]传统方式：用 for 循环遍历整个数组，每个元素地进行判断，再执行下一步操作用 f...
2020-04-25 18:09:40
213
原创 Promise简介
以定时器的异步事件为例：每一个定时器都看作是一次网络请求，如果用普通的$ajax来写的话，假如数据处理代码量多且请求嵌套过多，会出现回调地狱。。。promise写的话，结构清晰。处理优雅。new Promise((resolve, reject) => { // 第一次请求 setTimeout(() => { resolve();...
2020-04-18 00:09:55
105
原创 Uncaught (in promise) NavigationDuplicated {_name:""NavigationDuplicated"... 的解决方法
import VueRouter from 'vue-router';Vue.use(VueRouter)const originalPush = VueRouter.prototype.push;VueRouter.prototype.push = function push(location) { return originalPush.call(this, locati...
2020-04-15 20:00:14
307
原创 微信小程序数据传递方式
1、在一个页面上的数据从视图层传递到逻辑层，可以用标签的data-xx属性的形式设置某一个值，再在逻辑层中用currentTarget.dataset.xx取出来。（鉴于currentTarget和target的区别，只对事件绑定了的元素的某一属性取值）2、逻辑层到视图层的数据传递，用this.setData({ nameInWXML : nameInJS })把在js某...
2019-09-07 08:08:40
1174
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人