- 博客(35)
- 收藏
- 关注
RSS订阅原创 Vue2实现EventBus思路
Event Bus 介绍事件总线，用于组件之间传递数据的一种机制，它的原理其实也就是Vue组件的自定义事件机制；而Bus其实是一个Vue组件其挂在Vue构造函数所创建的对象原型上面Bus代码在某个工具目录下面新建一个文件eventBus.js，内容如下：const install = (Vue) => { const Bus = new Vue() Vue.prototype.$bus = Bus}export default { install}之后在main.js里面引入
2021-06-12 14:35:31
1067
原创 Vue2用计算属性（computed）替代过滤器（filter）的问题
在Vue2里面一般处理文本比如时间格式化，文本替换等操作时，很容易想到使用filter，但是这有个问题，filter里面是没有this的，如果想使用到Vue实例只能换成computed或者method，比如下面这个例子：<template> <view> <view v-for="(item,index) in list" :key="index"> <!-- 对应下面错误方法一 --> <Item :content="item.t
2021-01-23 16:56:32
1672
原创 uni-app制作聊天页面时，点击底部输入框弹出键盘上推页面问题解决方案
一，页面结构设计先来看看聊天页面结构设计，外层布局如下：<template> <view> <!-- 消息列表 --> <scroll-view class="msg-list" scroll-y="true"> </scroll-view> <!-- 底部输入栏 --> <view class="input-box"> <input :adjust-position="false
2021-01-17 17:36:35
6798
7
原创 uni-app使用5+文件操作写入失败“不允许读”的Bug（安卓）
出现这个问题可能有如下几种情况：1，请求文件系统的类型错误也就是5+提供了这个几个变量来获取文件位置PRIVATE_WWW: 应用私有资源目录常量PRIVATE_DOC: 应用私有文档目录常量PUBLIC_DOCUMENTS: 应用公共文档目录常量PUBLIC_DOWNLOADS: 应用公共下载目录常量一般都是存储在PRIVATE开头的位置，这里是安卓的应用内部存储，只有对应的应用才能访问。当我们需要写文件，就不能填PRIVATE_WWW这个位置，这里会存到www目录下面，也就是/stor
2021-01-13 00:00:13
2186
原创 解释下ES6的模块语法？
单个ExportES6其实倾向于一个模块只有一个Export，所以默认的导出就叫做默认导出，一个模块只能只有一个默认导出1，默认导出默认导出有两种方式，如下：可以直接使用export default导出声明语句，或者变量、函数，如下// module.jsexport default let foo = 'foo' 也可以使用export { xxx as default }来导出默认// module.jslet foo = 'foo'export { foo as default
2020-11-06 16:13:38
191
原创 让我们来解析查询字符串吧
简介查询字符串，就是url地址里?后面的那一串字符串，如：https://editor.youkuaiyun.com/md/?not_checkout=1，这个url里的查询字符串就是not_checkout=1。现在我们有个任务，就是来解析查询字符串，就是把上面那个例子的参数变成对象的形式，如：{ not_checkout: '1'}用 URL 对象来解析URL对象是浏览器提供的对象，可以用其来解析 url，如：let urlStr = "https://google.com/search?q=hel
2020-08-04 16:56:04
442
原创 Yarn的镜像地址管理---Yrm
1，问题因为yarn的服务器是在国外，所以要提高下载包速度，得使用镜像改变源地址2，解决我们使用yrm来做yarn的镜像管理器；首先需要下载，使用如下命令下载安装npm i yrm -g之后可以通过以下命令来查看所提供的镜像地址yrm ls可以看到* npm ---- https://registry.npmjs.org/ cnpm --- http://r.cnpmjs.org/ taobao - https://registry.npm.taobao.org/ nj --
2020-06-29 20:18:05
1834
原创 Canvas学习笔记
一，基础假设html为<style> #canvas { background-color: #444; }</style><body> <canvas id="canvas"></canvas></body>下面的例子都是基于这个的1，设置画布宽高画布默认的宽高为300 * 150，我们...
2020-05-28 12:06:29
292
原创 Nuxt项目使用全局变量，函数，混合
当在Nuxt项目使用CSS预处理语言时，很有需要在全局添加变量，函数或者混合，这样子在项目的任何一个地方都可以使用，那怎么做呢？首先下载@nuxtjs/style-resourcesnpm install @nuxtjs/style-resources之后在nuxt.config.js里添加//....... modules: [ '@nuxtjs/style-resources...
2020-03-20 11:16:05
1284
原创 uni-app的image组件，本地图片未显示
这是个巨大的坑！！如果你的子组件的图片组件<image />的图片未显示，那么就对了，可以接着往下看。假设我的项目结构是这样的┌─components │ └─child.vue├─pages│ ├─index│ └─index.vue│ ├─static │ └─logo.png ├─main.js ...
2020-03-13 00:00:54
12895
5
原创 react-native-vector-icons安装过程的坑
概述由于我最近才学react-native，也刚刚接触了react-native-vector-icons来做图标，所以我就去官网找安装教程https://github.com/oblador/react-native-vector-icons#android我做的是Android系统，所以就按照里面的步骤，一步一步配置，但是，结果一堆报错，初步看来，好像是react-native的最新...
2020-03-11 16:13:11
681
2
原创 HTML元素上事件处理
绑定在HTML元素上的事件，最终会被解析到DOM属性里，如<button id='btn' onclick='alert(this.textContent)'>Click Me</button>会被解析到DOM为btn.onclick = function() { alert(this.textContent)}所以如果在HTML使用函数调用，如<...
2020-03-08 16:30:55
232
原创 防抖和节流
简介防抖和节流是用在对一些存在大量无意义频繁调用事件问题的一种优化方式，如：浏览器窗口滚动事件鼠标滑动事件输入事件常用在的业务场景页面回滚即时搜索区别防抖和节流是有区别的，如下：防抖：防抖是规定了事件调用后，在某个时间段后事件才执行，如果那个时间段未到之前，如果又调用了事件，则重新开始计时节流：节流是规定了事件调用后，在某个时间段后事件才执行，如果那个时间段未到之前...
2020-03-07 17:22:13
156
原创 瀑布流布局的设计和实现
简介瀑布流布局就是把大小不一的图片或者版块在不改变其原比例的同时铺满可视区，它们的宽度是一样的且保持着自己的比例，如花瓣网的布局思路想要实现这样的布局，先说白了，需要两个主要的技术点css的绝对定位布局js的dom操作那怎么实现呢？大体思路是这样的，如下图，外围元素相对定位，之后每一张图片都绝对定位，定位到合适的位置是不是感觉不可思议，那如果有几千张图片，岂不得累死？当然不是...
2020-03-06 22:31:01
803
1
原创 Nuxt项目使用全局变量，函数，混合
当在Nuxt项目使用CSS预处理语言时，很有需要在全局添加变量，函数或者混合，这样子在项目的任何一个地方都可以使用，那怎么做呢？首先下载@nuxtjs/style-resourcesnpm install @nuxtjs/style-resources之后在nuxt.config.js里添加//....... modules: [ '@nuxtjs/style-resources...
2020-03-06 16:03:00
1262
原创 微信小程序里的事件机制
一，小程序里的事件机制和网页开发一样，小程序里的事件机制原里上是一样的，都需要先经过捕获阶段，后经过冒泡阶段，即使一个绑定在组件上的事件被触发后需要经过这两个阶段（在以下描述中，默认认为事件为同一类型）1，捕获阶段当绑定在组件上的事件触发时，首先会进入捕获阶段，在这个阶段中会以这个组件向外的最外层组件开始，逐一地向内收缩检测是否有捕获阶段事件的组件，有的话，就会触发；当捕获阶段执行到刚刚那个...
2020-03-06 15:08:17
520
原创 HTML和CSS的一些易错点和技巧
1，清楚浮动的方法.clearfix::after { content: '.'; display: block; clear: both; visibility: hidden; height: 0; line-height: 0;}.clearfix { *zoom: 1;} .clearfix::before, .clearfix::after{ ...
2020-03-06 14:44:37
251
原创 JS获取和控制浏览器窗口尺寸
窗口可视区域大小可视区域高宽，不含滚动条document.documentElement.clientWidthdocument.documentElement.clientHeight可视区域高宽，包含滚动条window.innerWidthwindow.innerHeight整个网页文档的高宽由于各种原因，比较稳定的做法是let scrollHeight = Math...
2020-03-05 21:34:19
569
原创 JS中获取元素尺寸
offsetParent文档里每个元素其实都可以找到一个“定位祖先元素”，即由里到外往外层第一层符合下面一个特征的，就是“定位祖先元素”CSS 定位（position 为 absolute、relative 或 fixed），<td>、<th>、<table><body>其实CSS的绝对定位也是参考这个“定位祖先元素”的这个元素可以通...
2020-03-05 17:57:18
583
原创 浏览器页面生命周期你知道吗？
页面生命周期我们知道，浏览器其实就是扮演着一个从服务器获取资源，并且加载渲染资源的一个角色，在一次用户打开浏览器访问页面，到退出页面离开浏览器的过程，就是浏览器页面的一个生命周期，在这个生命周期可以分为几个重要阶段，都有对应的钩子函数DOMContentLoadedloadbeforeunloadunload简单来讲，这个几个钩子函数，分别对应这下面几个阶段页面的DOM树渲染完...
2020-03-04 17:13:20
1268
原创 对比一个Vue组件和一个React组件
Vue和React都是是以组件化的思维来编写页面，那么它们其实本质上有很多共同点，下面将对它们的组件形式进行对比。vue以单文件组件为例子，而react以单文件的类组件为例子
2020-02-28 15:40:08
628
原创 阿尔卑斯山JS？？AlpineJS入门
简介最近发现了一个好玩的框架，叫做AlpineJS，它是类似于Vue或者React这样的组件化开发框架，但是它更加轻量，下面是它的github地址https://github.com/alpinejs/alpineScrimba上的视频教程https://scrimba.com/g/galpinejs它更适合于在现有的项目里的某个部分应用组件（Vue和React也可以在某个部位适...
2020-02-27 20:30:17
3195
原创 对JS里“异步”的理解
异步所谓的异步代码其实就是非现在运行的代码，或者说在将来某个时刻会执行的代码；在JavaScript中，有一部分代码是会在主线程（JavaScript是单线程的，只有主线程）运行时就运行的代码（现在运行的代码），而另外一部分则放到事件循环队列中运行的代码，而这部分代码就是异步代码；而异步代码永远会在现在运行的代码运行之后才有可能被执行。注意：异步也是单线程的，区别只是在单线程上的执行时时间的...
2020-02-27 16:55:50
931
原创 Koa2-学习笔记
Koa2中文文档 https://demopark.github.io/koa-docs-Zh-CN/Koa2中文文档 https://koa.bootcss.com/Koa2中文文档(GitHub) https://github.com/demopark/koa-docs-Zh-CNKoa相比较于express，显得更加轻量，因为许多中间件是以第三方包的形式存在的，并没有整合到Koa...
2020-02-26 14:31:48
760
1
原创 注意push对象时，对象依旧有关连
请看下列代码let obj = { A:1, B:2 };let list = [];list.push(obj);// list --> [{ A:1,B:2 }]obj.A = '';obj.B = '';// obj --> {}console.log(list)// [{}]从上面的结果可以看出，你push对象到数组里，数组里的那个对象仍然和原来对象一致，...
2020-02-18 10:36:23
258
原创 Nuxt的路由守卫
在plugins下面新建路由守卫文件routeguard.js，在里面写如下代码export default ({ app }) => { app.router.beforeEach(async (to, from, next) => { console.log('to：',to.path); console.log('from', from.path...
2020-02-16 23:22:07
2977
1
原创 CastEerror
问题描述CastEerror是在mongoose中会遇到的，原因是你设置了一个动态路由，如: router.get('/blogs/:id')，之后在后面又设置了一个差不多的路由，如:router.get('/blogs/info')，这样当调用后一个路由时就会报错，说什么类似于info 不是 id之类的话解决只需要把两个路由的顺序颠倒就行...
2020-02-15 20:57:38
112
原创 对JS中This的理解和总结
在Javascript里的this，是无法在定义时就决定指向谁（也可说是不受词法作用域的限制，或者静态作用域的限制），这个行为和动态作用域相似，这个东西无法在js编译器工作时就定下来，而得等到js引擎的执行阶段时才确定一，调用位置函数里this由函数调用位置决定的，可以看看下面的例子：var a = "I'm a global a"function foo () { console.lo...
2020-02-14 14:31:47
280
原创 Linux远程管理命令
一，概念使用ssh客户端对ssh服务器进行远程操作；因为公司的服务器是放在机房里的，那里温度低，噪音大，不适合人在那里长期工作，所以需要用远程管理对服务器进行日常的维护；这要求客户端和服务端电脑都需要支持ssh服务；Linux系统和Unix系统默认就提供了此服务，端口号默认为22，而Windows系统是没有的，需要借助PuTTY或XShell提供的ssh服务（另外Git的bash也可以，并且提供...
2020-02-14 14:28:57
373
原创 webpack4简单入门
局部安装，webpack4想使用命令行的话，需要安装webpack-cli，这个webpack-cli是在命令输入webpack <entry>等指令操作的基础npm install --save-dev webpacknpm install --save-dev webpack-cli但是这样局部安装，想要使用命令行时，是找不到webpack指令的，需要加上npx即npx w...
2020-02-14 14:19:02
325
原创 Koa2——登陆注册demo（3）
在这一篇中，我们来改进些东西，比如用redis来存储session增强注册功能，增加邮箱和邮箱验证码验证用redis来存储session我们之前的session是用koa-session2来做的，在官网上也提供了用redis来存储的方式，是用了ioredis，所以我们这次也用ioredisnpm install ioredis然后在utils目录下创建store.js，其内容如下...
2020-02-14 14:13:23
379
原创 Koa2——登陆注册demo（2）
在上一篇中，简单地实现了登陆接口，在这一篇，我们来实现注册接口数据加密登出接口准备由于需要从服务发送请求，所以我们需要下载axiosnpm install axios在utils下新建axios.js文件，用来配置axiosconst axios = require('axios')const instance = axios.create({ baseURL: 'h...
2020-02-14 14:12:14
231
原创 Koa2——登陆注册demo（1）
简介passportjs是一个鉴权工具，配合许多登陆策略，可以实现登陆鉴权，“登陆策略”是啥？说人话就是选择什么方式登陆，如最最普通的就是在我们这个网站注册账户登陆，也有通过第三方登陆，GitHub，微信等，每一种登陆策略都有相应的别人写好的包，如下：StrategyProtocolDeveloperLocalHTML formJared HansonOpenI...
2020-02-14 14:11:13
347
原创 nvm管理多个版本的node.js
一，nvm介绍和安装nvm是node version management的缩写，故名知意，是node版本管理器的意思，可以让电脑在不同版本的node之间切换；安装步骤如下：如果之前独立装过node，为了避免干扰，先把它先删了可以前往其下载页https://github.com/coreybutler/nvm-windows/releases找到nvm-setup.zip文件直接下载其安装...
2020-02-14 14:06:28
189
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人