- 博客(22)
- 收藏
- 关注
RSS订阅原创 如何监听storage仓库变化(只限localstorage)
必备知识：Event() 构造函数, 创建一个新的事件对象 Event。第一个参数为所创建事件的名称。LocalStorage：默认情况下，当前页面修改localStorage，本页面是无法监听的，只有同源的其他页面才可以监听到本页面localStorage的改变。所以默认监听localstorage变化的三个条件：至少打开了两个同源页面其中一个页面修改了localStorage另外的同源页面做了localStorage的监听监听方法：// 回调的e对象中含有localStorage改
2021-07-19 17:47:54
2837
原创 Vue的一些常用高阶用法
一.Vuex篇当需要使用Vuex中的状态state或方法mutations/actions时，简单的用法是这样的：dom里：$store.state.hasLogined，scirpt里：this.$store.state.hasLogined当项目Vuex仓库比较庞大时，推荐使用如下写法：1.state/getterscomputed: { ...mapState(['state1','state2'])}如果属性位于仓库的子模块里：computed: { ...mapS
2021-06-10 15:18:41
1158
原创 双屏传输消息window.postMessage
window.postMessage() 方法可以安全地实现跨源通信。通常，对于两个不同页面的脚本，只有当执行它们的页面位于具有相同的协议（通常为https），端口号（443为https的默认值），以及主机 (两个页面的模数 Document.domain设置为相同的值) 时，这两个脚本才能相互通信。window.postMessage() 方法提供了一种受控机制来规避此限制，只要正确的使用，这种方法就很安全。一、发送消息otherWindowRef.postMessage(message, targ
2021-03-31 15:49:05
377
原创 new 操作符做了什么
// 构造函数const Func = function() { this.name = 'fhh'; this.age = 18;}const myFunc = new Func(); // new 一个构造函数做了什么?结果: myFunc: { name: 'fhh', age: 18}1.new 一个对象let obj = new Object();2.把new出来的空对象的__proto__指针指向构造函数Func的prototype指针，即指向Func的原型对象o
2021-03-31 15:21:28
198
1
原创 Angular中路由跳转并携带参数的三种方式
一.路由传值传递<a [routerLink]="['/devicepay']" [queryParams]="{id:key}">接收import {ActivatedRoute} from '@angular/router'constructor(public route:ActivatedRoute) { }this.route.queryParams.subscribe((res)=>{ console.log(res)})二.动态路由传值动态路由需要定义
2020-12-08 16:49:58
5001
1
原创 文本超长溢出省略号
1.单行文本.ellipsis {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}2.多行文本.ellipsis {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3; //文本行数}...
2020-12-04 13:50:22
228
原创 Angular的依赖注入(dependency injection)
依赖不一定是服务 —— 它还可能是函数或值。Angular中的依赖可以注入在全局，模块，或组件中。1.全局@Injectable({ providedIn: 'root',})2.模块@NgModule({ providers: [ BackendService, Logger ], ...})3.组件@Component({ selector: 'app-hero-list', templateUrl: './hero-list.componen
2020-12-03 17:34:19
311
原创 Angular组件通信
一.父传子1.子组件import { Input } from '@angular/core';export class HeroChildComponent { @Input() masterName: string;}2.父组件自定义指令二.子传父1.子组件import { EventEmitter, Output } from '@angular/core';export class VoterComponent { @Output() voted = new Event
2020-11-10 10:04:26
130
原创 MongoDB常用指令
一.创建数据库use itying二.查看数据库show dbs三.显示当前的数据集合show collections四.删除集合db.表名.drop()五.删除数据库db.dropDatabase()六.插入数据（可添加多个字段）db.表名.insert({“字段名”:“字段值”})七.查找数据（全部）db.表名.find()八.查找数据（指定条件）$gt大于$lt小于db.表名.find({“字段名”:“字段值”})db.表名.find({“age”: {gt:22,
2020-10-27 14:33:49
145
原创 关于跨域的问题一些见解
CORSCORS是一个W3C标准，全称是"跨域资源共享"（Cross-origin resource sharing）。CORS需要服务器端配合才能完成跨域资源请求。跨域请求分为普通请求和非普通请求。1.普通请求浏览器会直接发送1次请求(1)如果服务器端允许当前请求源访问，则响应头会返回Access-Control-Allow-Origin字段，浏览器会将请求到的数据正常返回给你。(2)如果服务器端不允许当前请求源访问，则服务器端也会正常返回一个http响应，响应头会不包含Access-Cont
2020-10-15 13:00:50
168
原创 服务器部署笔记
一.安全组开放需要的端口二.安装宝塔三.安装node.jsLinux： wget ‘url’ —安装tar xf ‘name’ —解压四.将目录软链接到全局环境下（命令后面的/usr/local/bin/node是固定的）ln -s /deploy/node-v8.11.3-linux-x64/bin/node /usr/local/bin/nodeln -s /deploy/node-v8.11.3-linux-x64/bin/npm /usr/local/bin/
2020-10-13 18:09:13
155
原创 前端解决跨域的三种方式
看到两种反向代理解决跨域的原理，觉得都很有道理，记录一下。(前提是服务器端不支持跨域访问，不然也不需要前端做跨域处理了)一. 虚拟服务器这点vue自带的反向代理就是采用这个原理。当进行跨域访问时，vue会生成一个虚拟服务器，请求将发送到虚拟服务器，虚拟服务器代替你去访问目标服务器，由于服务器端不存在跨域访问的问题，所以虚拟服务器将请求到的数据再返回给你。二.中间层跨域策略是浏览器的安全策略，服务器端并不存在跨域访问这一说。当进行跨域访问时，浏览器如果直接发送给目标服务器，这时浏览器的请求源和目标服
2020-10-13 10:22:39
11113
2
原创 Vue开发中页面路径相同但参数不同的跳转实现热更新
正常情况下，页面路径相同但参数不同的跳转是无法实现热更新的，这是因为Vue自身设计时候的机制，会自动复用相同的组件。以下有两种思路可实现页面热更新：一、通过key属性在当前页面组件对应的router-view上加上key属性，key设为$route.fullPath保持唯一性，这样当你页面参数变化时，由于你设了key值，页面组件无法复用，便会重新渲染页面。二、通过watch方法watch可用来监听页面数据的变化，因此可在watch中监听当前页面路由的变化，当参数发生变化时，调用你自己写好的页面re
2020-09-29 17:31:34
1200
原创 前端登录验证(Token)
1.登录验证(token)请求需要登录态标识的接口时,会先判断本地是否存储的有token。①如果是客户端首次登陆, 会将用户密码发送给服务器端, 服务器判断用户密码是否正确, 如果验证正确的话返回一个token给客户端。客户端拿到返回的token在localstorage或者sessionstorage中存储，也可以顺便存储在vuex中。②之后如果客户端访问需要登陆态标识的接口时,会拿到客户端存储的token,放在请求头header中发送请求。服务器端拿到token值判断是否过期或者错误,返回对应的状
2020-09-23 11:23:38
4811
2
转载 vue监听不到数组和对象变化的几种情况
链接https://blog.youkuaiyun.com/weixin_45626040/article/details/106330480
2020-09-09 09:10:38
1090
原创 APP端页面位置保持的几种方法(Vue篇)
一.导航守卫1.如果不清楚导航守卫概念的，附上官网链接官网传送门const router = new VueRouter({ ... })router.beforeEach((to, from, next) => { if(from.name == 'home') { // from.meta.savedY = window.pageYOffset from.meta.savedY = document.documentElement.scrollTop
2020-09-08 11:20:15
449
原创 防抖和节流
一、防抖防抖是指函数在n秒内只能执行一次，如果函数在此期间又触发了，会重新计算n秒的时间。二、节流节流是指连续触发事件，但是n秒内只执行一次，会稀释函数的执行频率。
2020-09-06 17:48:44
143
原创 盘点vant框架踩过的坑
一.Tabbar和Tab中的属性"before-change"搭配路由使用会失效1.由于Tabbar一般用来做底部导航栏，会搭配路由功能使用，此时before-change属性失效。2.Tab一般做小的选项卡，不能搭配路由，before-change属性有效。...
2020-09-06 17:07:28
974
原创 移动端开发滚动(但不显示滚动条)
1.在css中设置::-webkit-scrollbar { display: none!important; width: 0px; height: 0px; }
2020-09-06 12:14:50
928
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人