![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Javascript
文章平均质量分 51
Are杨
这个作者很懒,什么都没留下…
展开
-
JSON.parse(JSON.stringify(obj))深拷贝的问题
如果obj中的对象是有构造函数生成的, 则使用JSON.parse(JSON.stringify(obj))深拷贝后,会丢弃对象的constructor。浅拷贝 : 只是将数据中所有的数据引用下来,依旧指向同一个存放地址,拷贝之后的数据修改之后,也会影响到原数据的中的对象数据。1、如果obj里面存在时间对象,JSON.parse(JSON.stringify(obj))之后,时间对象变成了字符串。深拷贝: 将数据中所有的数据拷贝下来,对拷贝之后的数据进行修改不会影响到原数据。原创 2022-10-18 13:29:10 · 1994 阅读 · 0 评论 -
微信小程序开发常用知识
生命周期应用的生命周期函数onLaunch(Object object)小程序初始化完成时触发,全局只触发一次。参数也可以使用 wx.getLaunchOptionsSync 获取。onShow(Object object)小程序启动,或从后台进入前台显示时触发。也可以使用 wx.onAppShow 绑定监听。onHide()小程序从前台进入后台时触发。也可以使用 wx.onAppHide 绑定监听。onError(String error)小程序发生脚本错误或 API 调用报错时触发。原创 2022-04-07 23:50:58 · 947 阅读 · 0 评论 -
js中null和undefined的区别
null表示"没有对象",即该处不应该有值。典型用法是:(1) 作为函数的参数,表示该函数的参数不是对象。(2) 作为对象原型链的终点。Object.getPrototypeOf(Object.prototype)// nullundefined表示"缺少值",就是此处应该有一个值,但是还没有定义。典型用法是:(1)变量被声明了,但没有赋值时,就等于undefined。(2) 调用函数时,应该提供的参数没有提供,该参数等于undefined。(3)对象没有赋值的属性,该属性的值为u转载 2021-08-19 09:24:06 · 128 阅读 · 0 评论 -
Vue高级实战技巧
自动注册组件我们平时可能这样引入注册组件。每次都得需要在头部引入,然后注册,最后在模板上使用。<template> <div id="app"> <HelloWorld msg="Welcome to Your Vue.js App"/> </div></template><script>import HelloWorld from './components/HelloWorld.vue'export转载 2021-07-21 16:19:45 · 242 阅读 · 0 评论 -
JS中实用的工具函数
视频全屏 // 全屏 function fullScreen(el) { const isFullscreen = document.fullScreen || document.mozFullScreen || document.webkitIsFullScreen; if (!isFullscreen) { //进入全屏,多重短路表达式 (el.re转载 2021-07-21 13:22:29 · 609 阅读 · 0 评论 -
Vue3.0响应式API整理
响应性APIreactive作用: 创建一个响应式数据。本质: 传入数据(复杂类型:数组和json对象)包装成一个Proxy对象。如果传入其他对象,默认情况下修改对象,界面不会自动更新,如果想更新,可以通过重新赋值(创建一个新的对象)的方式。<template> <div class="reactive"> <button @click="fn">点击</button> <p>{{ state }}</p>转载 2021-07-21 12:44:34 · 480 阅读 · 0 评论 -
vue 自定义弹窗组件
父组件<template> <div> <p @click="onDelete"> 打开 </p> <!-- 弹框 --> <code-dialog :status.sync="deleteDialogStatus" /> </div></template><script>import codeDialog from原创 2021-07-21 12:31:47 · 2125 阅读 · 0 评论 -
TS笔记 (记录一下)
## **TypeScript中的基本类型**TypeScript中的基本类型:- 类型声明 - 类型声明是TS非常重要的一个特点; - 通过类型声明可以指定TS中变量(参数、形参)的类型; - 指定类型后,当为变量赋值时,TS编译器会自动检查值是否符合类型声明,符合则赋值,否则报错; - 简而言之,类型声明给变量设置了类型,使得变量只能存储某种类型的值; - 语法: - ```typescript let 变量: 类型;原创 2021-03-09 10:30:20 · 266 阅读 · 0 评论 -
vue3.0笔记(二)
关于setup一些细节问题及组件之间的传值这里创建一个父组件<template> <h2>App父级组件</h2> <h3>msg:{{ msg }}</h3> <button @click="msg += '==='">更新数据</button> <hr /> <Child :msg="msg" msg2="真香" @xxx="xxx" /></template>原创 2021-02-22 16:10:12 · 151 阅读 · 0 评论 -
javascript数组操作方法
var arr = [{ key: '01', value: '乐乐' }, { key: '02', value: '博博' }, { key: '03', value: '淘淘' },{ key: '04', value: '哈哈' },{ key: '01', value: '乐乐' }]; // 方法1:利用对象访问属性的方法,判断对象中是否存在key var result = []; var obj = {转载 2021-02-22 14:38:34 · 300 阅读 · 0 评论 -
vue3.0笔记(一)
2020年9月发布的正式版Vue3支持大多数的Vue2的特性Vue中设计了一套强大的composition组合APi代替了Vue2中的option API ,复用性更强了更好的支持TS最主要: Vue3中使用了Proxy配合Reflect 代替了Vue2中Object.defineProperty()方法实现数据的响应式(数据代理) 之前用的是Options APIexport default{ data:"" computed:"" watch:"" moun原创 2021-02-08 15:34:03 · 242 阅读 · 0 评论 -
在 create-react-app 中使用antd-mobile
安装和初始化$ npm install -g create-react-app$ create-react-app my-app$ npm install antd-mobile --save$ cd my-app$ npm start<!DOCTYPE html><html><head> <!-- set `maximum-scale` for some compatibility issues --> <meta name="原创 2020-12-23 09:45:16 · 416 阅读 · 0 评论 -
web移动端vConsole调试
移动端开发往往不想PC端时刻能看到console.log的信息那么,如果将console.log应用到移动端呢?没错那就需要借助第三方插件:vConsole第一种用法:引入js文件https://www.npmjs.com/package/vconsole<script src="http://wechatfe.github.io/vconsole/lib/vconsole.min.js?v=3.2.0"></script><script> console.原创 2020-12-08 11:40:58 · 430 阅读 · 0 评论 -
element-ui button防重复点击指令
防止按钮重复点击指令因为手快的同学,再进行按钮操作的时候,会触发多次,若这个点击事件接入API,就会重复请求API。所以为了防止这个问题,我不可能一个按钮去写一个防点击,这多麻烦。所以就写了个指令。下面上代码export default {}.install = (Vue, options = {}) => { Vue.directive('dbClick', { inserted(el, binding) { el.addEventListener('click', e转载 2020-12-02 13:00:32 · 3154 阅读 · 1 评论 -
js数组转换为数组对象
let arr = ["刘备","关羽","张飞","赵云","马超","黄忠"];let obj = {};// 将数组转化为对象for (let key in arr) { obj[key] = arr[key]; };let newObj = Object.keys(obj).map(val => ({ label: obj[val], value: obj[val] }));console.log(newObj)效果如下:原文转转载 2020-12-02 09:39:05 · 3975 阅读 · 0 评论 -
promise简单理解
1、什么是promise所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件的结果。从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。Promise 提供统一的API ,各种异步操作都可以用同样的方法进行处理,让开发者不用关注于时序和底层的结果。Promise 的状态具有不受外界影响和不可逆两个特点。2.Promise是如何解决异步操作1)调用回调过早对于Promise 来说,即使是立即完成的 Promise 也无法被同步观察到,也就是说一个Promi原创 2020-11-16 15:27:10 · 1236 阅读 · 0 评论 -
JS 数组操作使用小技巧
srot()如果不带参数,是将按字母顺序对数组中的元素进行排序,也就是是按照字符编码的顺序进行排序。var arr1 = ['a', 'd', 'c', 'b'];arr.sort(); //['a', 'b', 'c', 'd'] var arr2 = [10, 5, 40, 25, 100, 1];arr2.sort(); //[1, 10 ,100, 25, 40, 5]传两个形参当返回值为正数时,交换传入两形参在数组中位置//排序 let list=[{index:'.原创 2020-10-29 16:49:58 · 143 阅读 · 0 评论 -
element ui el-upload上穿多张图片
需求如下:这里是在form表单中做的<el-form-item label="凭证照片" ref="loadElement" prop="picList"> <el-upload action="#" ref="upload" list-type="picture-card" :on-preview="handlePictureCardPreview" :on-re原创 2020-10-24 13:54:12 · 1162 阅读 · 1 评论 -
仿element ui实现自定义UI插件
有时候我们在做开发的时候,就想自己写一个插件然后就可以使用自己的插件,那种成就感很强。博主最近研究element-ui和axios的时候,发现他们是自定义组件,但是唯一有一点不同的是,在用element-ui的时候是使用Vue.use()语句来使用的,而axios的时候,不用Vue.use(),只要import就可以导入进来了,感觉很神奇,细细的发现,原来他们的不同是因为axios里面并没有写install方法,而element-ui就有写这个方法,下面就利用这个install来写一个自己的插件。首先看一原创 2020-10-16 11:35:09 · 534 阅读 · 0 评论 -
vue项目实现每隔一段时间刷新当前页面(轮询)
背景描述:我使用的是vue+element 开发系统,需要一段时间监测数据的变化解决方案:本来想使用websock效果更佳,想到仅仅单页面使用就是用后端缓存数据前端定时请求的方法。使用定时器和延时器的方案首先介绍下定时器和延时器setInterval(function(){}, milliseconds)——会不停的调用函数setTimeout(function(){}, milliseconds)——只执行函数一次乍看之下,setInterval会符合我们的业务需求,然而也需要注意一些坑,原创 2020-10-11 13:16:33 · 6015 阅读 · 1 评论 -
element ui el-button按钮防止多次触发单击事件
需求:添加提示,使按钮点击提交数据时,按钮不可以再操作,防止数据重复提交,防止多次触发事件实现思路:添加全局loading让遮罩层后不可点击话不多说上代码 <el-button type="primary" @click="push">提交</el-button>这里提交数据为formdatapush(){ const loadingObj=this.$loading({ lock:true, text:"提交中...",原创 2020-08-12 17:01:20 · 6755 阅读 · 2 评论 -
JS数组扁平化的一些方法
引子:这些日子在看es相关的新属性是有一个数组的方法 flat() 引起的我的注意。1 什么是扁平化?我去找了一下维基百科,上面并没有关于扁平化的直接解释,只有一个扁平化组织释义。先来说一下,与扁平化对立的组织:金字塔组织,这个众所周知,它表现的层级结构就是一个金字塔式的形状。扁平化组织(Flat organization)也被称为横向组织(horizontal organization),是一种在员工和Boss之间很少存在或不存在中间管理层的组织。左侧就是金字塔组织,右侧就是扁平化组织。可见扁转载 2020-07-31 10:49:30 · 349 阅读 · 0 评论 -
Vue 中使用watch监听$route 无效问题
Vue 中使用watch监听$route失效问题!路由:{ name: 'secondUser ', component: secondUser, path: '/secondUser',}-------------------------------------------------------------------------------------------------------------------页面中监听 watch:{原创 2020-07-21 13:19:42 · 4821 阅读 · 0 评论 -
Element ui Table表格匹配字典项中的数据
在工作中通常会遇到Table表格匹配字典项中的数据这里介绍几种方法大家仅供参考 <el-table :data="tableData" style="width: 100%"> <el-table-column prop="date" label="日期" width="180"> </el-table-column> <el-table-column prop="type" label="类型"原创 2020-07-15 15:52:11 · 7231 阅读 · 1 评论 -
Vue element ui结合java后台导出Excel(二进制文件流)
Vue结合后台详解导入导出Excel问题今天讲讲 前台Vue配合后台(java)导出Excel 后台返回的数据是 二进制文件流 如何将此变为 弹框下载当时开发呢,我们后台是java 有控件 可以直接将数据导出并生成Excel文件,但是前后台传输是不可能直接传输文件的,是以二进制文件流进行传输的,此时呢就会遇到一个问题,因为是后台,必然会涉及到权限,权限就涉及到token,token传输就会出现限制问题,所以我会列出三种方法我的是Vue项目~~1.不需要token的方法 <template&g转载 2020-07-10 10:14:06 · 2351 阅读 · 0 评论 -
vue -element ui 自定义验证规则,封装在公共的文件里
1.首先 新建一个rules.js 的文件 编写校验规则 我新建在api 文件下。// 账号let codeReg = /^(?![0-9]*$)(?![a-zA-Z]*$)[a-zA-Z0-9]{6,20}$/// 电话let phoneReg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/// 必须为数字let numberReg = /^\d+$|^\d+[.]?\d+$/// 密码let passwordReg = /^(?![\d]+$)(?![a-zA-Z转载 2020-07-08 09:39:21 · 1466 阅读 · 1 评论 -
浅谈Vue element-ui表格那些实用操作
最近的项目中使用到element-ui组件库,由于做的是后台管理系统,所以经常需要操作表格,编辑样式的过程中遇到一些问题,官网针对table给出了很多的api,自己可以自定义,基本能满足产品需求,但是没有给出具体的案例,网上的资料也比较简略,这里简单整理下一些常用的操作,如果有类似的功能可以做一个参考。具体的使用方法还是建议仔细阅读官网-table章节:https://element.eleme.cn/#/zh-CN/component/table#table-column-scoped-slot自定原创 2020-07-08 09:27:12 · 1226 阅读 · 0 评论 -
新电脑IP改变时登录不了GitHub
初到新公司或者在家里经常会出现IP地址改变的时候这时会发现自己的GitHub进不去了下面为大家提供解决办法1.更改hosts文件,地址:C:\Windows\System32\Drivers\etc不能直接修改,将其拷贝到桌面,进行修改后,再复制到文件目录下(直接替换)2.在hosts文件中添加(注意是通过下方第三条网站查到自己的):#github192.30.253.112 github.com151.101.113.194 github.global.ssl.fastly.net3.前面原创 2020-06-18 12:30:57 · 402 阅读 · 0 评论 -
问题:当控制台解析preview和response数据不一致时,怎么处理
@[遇到的问题:这次在做项目时,发现后端返回的数据在preview和response中不一致。response里的是正确的数据,可是取数据的时候只能拿到错误的。当时很是纳闷~~~问题原因:原因是因为数据为Long型,返回给浏览器以后,浏览器转换数据格式的时候出现问题。也就说,JS在处理返回数据类型是Long的时候,因为Long类型位数过长,精度会丢失一部分。解决思路:后端把数据传到前...转载 2020-01-21 16:44:43 · 2925 阅读 · 0 评论 -
浅谈Vue中的路由配置项meta
meta简单来说就是路由元信息 也就是每个路由身上携带的信息。这里简单的举两个例子:其次还有一个功能就是能够控制公共组件的显示或隐藏请忽视 keep-alive标签...原创 2019-08-07 23:24:33 · 10009 阅读 · 0 评论 -
关于构建前端Mock的步骤和相应的增删改查!
作为一个从事前端工作的程序员与后端对接时,经常会遇到临近项目上线时才会收到后端人员的接口信息。大多数人很难在短的时间内完成渲染和调试。这时我们就需要在本地模拟后端接口用来测试前端效果 这种做法称之为构建前端Mock。这里主要为大家介绍一下json-serverjson-server的基本使用1.首先我们要进行全局安装window+R 输入cmd进行全局安装cnpm install j...原创 2019-08-01 14:55:32 · 903 阅读 · 0 评论 -
传统的DOM是如何进行渲染的
DOM的渲染指的是对于浏览器中显现给用户的DOM文档的生成过程。渲染过程大致可以分为三个阶段:1.纯后端渲染(又称为服务器端渲染)(1).纯后端渲染:采用这样的渲染方式,就是每一个页面中,在Chrome中展开得到的DOM,和服务器返回的DOM是基本一致的(可以通过查看网页源代码来得到服务器返回的DOM)。当然,这里是“基本”一致,因为实际操作中,页面或多或少还是会带有一些js代码,并且在浏览...原创 2019-07-15 22:28:38 · 271 阅读 · 0 评论