本文实例为大家分享了JavaScript实现简易购物车的具体代码，供大家参考，具体内容如下 代码： !DOCTYPE htmlhtml head meta charset="utf-8" / titleES6购物车/title style type="text/css" table { width: 50%; po...

本文实例为大家分享了JavaScript实现简易轮播图的具体代码，供大家参考，具体内容如下 完整代码： !DOCTYPE htmlhtmlhead meta charset="UTF-8" titleES6轮播图/title script/script style * { margin: 0; paddin...

笔者将node安装到了D盘，同时也需要改变npm全局包默认安装的路径，因为不想占C盘空间 第一步当然是去node官网下载对应的版本，同时安装到D盘，先要在D盘新建一个nodejs文件夹 安装不...

目录 1. 写在前面 2. overlay 实现popup弹窗 2.1 vue 页面 addPopup() 方法详解 2.2 autoPan 属性为false效果 3. overlay 实现 label标注信息 4 overlay 实现 text文本信息 5. 附上完整代码 1. 写在前面 常见的地...

目录 报错提示 错误原因 错误演示 解决方法 方法一 方法二 方法三 报错提示 Navigating to current location ("/path") is not allowed 错误原因 控制台出现以上这种 Navigating to current location ("/path")...

目录 问题描述 前端控制（方式一） 思路 代码 后端控制（方式二） 思路 代码 总结 问题描述 产品说，出于安全考虑，用户长时间不操作，就回到登录页面，让用户重新登录，就像银行...

目录 一、基础 二、节点、树以及虚拟 DOM 1、虚拟 DOM 三、createElement 参数 1、深入数据对象 2、完整示例 3、约束 四、使用 JavaScript 代替模板功能 1、v-if 和 v-for 2、v-model 3、事件 按键修...

目录 1. 示例：this 能够直接获取到 data 和 methods 2. 准备环境调试源码一探究竟 2.1 Vue 构造函数 2.2 _init 初始化函数 2.3 initState 初始化状态 2.4 initMethods 初始化方法 2.4.1 bind 返回一个函数，...

目录 JS三座大山 同步异步 同步异步区别 作用域、闭包 函数作用域链 块作用域 闭包 闭包解决用var导致下标错误的问题 投票机 闭包两个面试题 原型、原型链 原型对象 原型链 完整原型...

目录 1. 页面布局 2. 图片上传和展示 3. 初始化画布 4. 切换模板 5. 输出图片 这里用到的技术： HTML+ CSS+ JavaScript； download.js库； fabric.js库； 先上体验链接：g.cuggz.com/ 。 注：可以点击上...

目录 1 前言 2 前置知识点 2.1 数据类型 2.2 判断是否是自身属性(hasOwnProperty) 3 一点小思考 3.1 修改 constructor 3.1.1 instanceof 3.1.2 isPrototypeOf 3.2 修改__proto__|prototype 4 修改和获取原型对象的方...

目录 1. 使用函数创建组件 2. 使用类创建组件 3. 抽离为独立JS文件 1. 使用函数创建组件 函数组件：使用JS的函数(或箭头函数)创建的组件 约定1：函数名称必须以大写字母开头 约定2：函...

目录 1、前言 2、实现 3、为何不使用HTML拖放API实现？ 4、总结 1、前言 拖拽排序对于小伙伴们来说应该不陌生，平时工作的时候，可能会选择使用类似 Sortable.js 这样的开源库来实现需求...

高效实现需求，避免臃肿的组件库和重复造轮子，前段时间做了很多大屏展示类的项目，今天来跟大家分享一下，大屏的实践过程，最开始我是使用了dataview 这个组件库，然后发现是自...

目录 一、使用javascript解析二维码 1、二维码是什么 二、qrcode-parser 1、安装方式 2、使用方式 三、ngx-qrcode2 1、安装方式 2、使用方式 四、前端生成二维码 1、安装方式 2、使用方式 3、案...

在新项目中，axios能实现防重复提交的功能，不过老项目（例如jQuery）的项目中，没有axios。但是导入Ajax-hook 就可以实现 Ajax-hook源码地址 : https://github.com/wendux/Ajax-hook 导入 script src="ht...

template div class="app-container" el-table :data="tableData3" style="width: 100%" el-table-column width="120" prop="date"/el-table-column el-table-column prop="name" label="姓名" width="120"/el-table-column el-table-column label="地址"...

最近项目用到了vuethink，里面集成了element-ui，之前一直用的是bootstrap框架，对js也是一知半解，然后也用过vue.js，但也是学的不通透的，然后就各种入坑。 下面就分析一下我使用elemen...

目录 数组简介 数组字面量 二维数组 总结 数组简介 数组 （ Array ） - 数组也是一个对象 它和我们普通对象功能类似，也是用来储存一些值的 不同的是普通对象是使用字符串作为属性值...

目录 Rract是啥？ 背景 React脚手架 JSX是什么 Rract是啥？ React 是用于构建用户界面的 JavaScript 库 构建用户界面. User Interface，对咱们前端来说，简单理解为：HTML 页面 javscrtipt库。不是框架...

Vue首屏性能优化组件 简单实现一个Vue首屏性能优化组件，现代化浏览器提供了很多新接口，在不考虑IE兼容性的情况下，这些接口可以很大程度上减少编写代码的工作量以及做一些性能...

页面:base： template div class="tab-container" h1 style="text-align: center" 申请{{ form.category }}{{ form.companyType }}入驻 /h1 div class="form-panel" style="margin-left: 20px;text-align: right;" el-button type="info" @click="canc...

目录 一、问题背景： 二、问题原因： 三、问题解决： 总结： 一、问题背景： window.print()页面打印出现页面无响应 看了网上很多办法都是让用 window.location.reload() ,对于这个解决方案不...

目录 1、对象字面量 2、new 关键字创建对象 3、使用 Object.create() 创建对象 4、 使用扩展操作符：... 5、使用Object.assign()方法 6、简写属性 7、简写方法 前言： 在 JavaScript 中，对象是一组...

目录 1.运算符 总结 1.运算符 运算符（operator）也称操作符，是用于实现赋值、比较和执行算术运算等功能的符号。 JavaScript中常用的运算符有： 算术运算符 （+、- 、* 、/ 、%） 递增和...

目录 1.使用withRouter组件 2、使用Route标签 React Router 5.1.0使用useHistory 在React Router v4中 可以使用 withRouter组件 使用标签 1.使用withRouter组件 withRouter组件将注入history对象作为该组件的属性...

目录 立即执行函数格式 立即执行函数其他方式–表达式 立即执行函数可以带参数 应用 总结 在JavaScript中有时候看到一些很神奇的函数比如下面截图： 这种函数只要浏览器加载的时候...

目录 作用域 全局作用域 函数作用域 if，switch，for ，while 块作用域 作用域链 总结 再聊AO和BO之前还需要了解作用域的概念，这样方便后面了解很多东西，比如this指向等。 作用域 作用...

一、什么是自定义hooks 逻辑复用 简单来说就是使用自定义hook可以将某些组件逻辑提取到可重用的函数中。自定义hook是一个从 use 开始的调用其他hook的Javascript函数。 二、不使用自定义...

提示 这个插件只能在https协议下才能访问，http协议不好使，最好用vue2,vue3容易报错！！！！！ 描述 通过vue的方式，实现扫码功能 参考文档：vue-qrcode-reader去官网–官方文档 效果展示...

目录 技术栈 效果 分析 技术栈 侧边栏用 Antdtab使用element 效果 template div class="main-card" el-row el-col :span="3" div class="menu-all" div class="menu-head" span class="menu-head-title"仓库管理/span/span class="me...

目录 一、前言 二、使用axios拦截器打印前端日志 一、前言 很多时候我们需要对前端进行调试，也就是前后端接口之间交互的调试，常用的方式肯定是打日志了，如 console.log ('日志内容...

1. 目的： 让代码更好维护，让多种数据分类更加明确。 2. 修改store/index.js store/index.js const countAbout = { namespaced:true,//开启命名空间 state:{x:1}, mutations: { ... }, actions: { ... }, getters: { bigSum(...

目录 前言 什么是 VueUse 简单上手 还有我们熟悉的 防抖 和 节流 还还有全局状态共享的函数 更多 前言 上次在看前端早早聊大会中， 尤大大再一次提到了 VueUse 的一个库。 好奇了一下，...

目录 VueUse 有哪些实用程序？ 将 VueUse 安装到你的 Vue 项目中 1、useRefHistory 跟踪响应式数据的更改 2、onClickOutside 关闭模态 3、useVModel 简化了 v-model 绑定 4、使用InterpObserver 跟踪元素可见...

目录 一、实现点击菜单跳转 1、统一页面命名方式 2、新增管理页面 3、添加路由 4、在菜单中绑定路由 二、实际效果 一、实现点击菜单跳转 1、统一页面命名方式 我们先将页面命名统...

前言： 在vue项目中怎么获取当前鼠标划过的坐标呢，这里来分享下方法。 实现效果： 实现步骤： 1、引入相关文件 import MousePosition from 'ol/control/MousePosition';import {createStringXY} from 'ol/c...

最近项目有一个需求，需要上传图片，但是客户上传的图片大小不一，所以我们需要规定客户的图片比例，但又需要是客户所需的，所以就想到了截图 实现效果 我们的架构是vue，所以...

目录 2、逗号运算符 3、javaScript空值合并操作符（） 4、javaScript可选链操作符( . ) 1、前言 js的运算符很多，之前有文章提过。 例如如下： js整数的操作： 使用 |0 和 ~~ 可以将浮点转成整...

目录 一、js整数的操作 二、重写原生alert,记录弹框次数 三、数字交换不声明中间变量的方法 四、万物皆对象 五、If语句的变形 六、使用===，而不是＝＝ 七、使用闭包实现私有变量 八...

今天又是一个非常实用的案例哟，听名字就觉得高级很难对吧，今天就来写一个案例，让你轻松学到轮播图的精髓！！ 还是老规矩，来看一下实现效果！！ 学习轮播图的首先是要把图...

1. 在插入、更新、移除DOM元素时，在合适的时候给元素添加样式类名 2. 元素有一个进入过程：Enter，一个离开过程Leave。 两个过程都有一个初始态（）和终止态（-to）和两态之间的过度...

参考其他比较专业的博客系统，都在代码块上有一个复制代码的按钮。用来快速复制整个代码块的代码。于是我也想给我的博客增加一个这个功能。 注：chrome测试通过。其他浏览器未进...

概述 原型模式是指原型实例指向创建对象的种类，并通过拷贝这些原型创建新的对象，是一种用来创建对象的模式，也就是创建一个对象作为另一个对象的prototype属性； prototype警告：...

概述 建造者模式是相对比较简单的一种设计模式，属于创建型模式的一种； 定义：将一个复杂的对象分解成多个简单的对象来进行构建，将复杂的构建层与表现层分离，使相同的构建...

目录 概述 代码实现 简单版单例模式 改良版 代理版单例模式 惰性单例模式 概述 单例模式也称为单体模式，规定一个类只有一个实例，并且提供可全局访问点； 在读这篇文章之前，也...

函数柯里化（黑人问号脸）？？？Currying（黑人问号脸）？？？妥妥的中式翻译既视感；下面来一起看看究竟【文章来源：http://www.yidunidc.com/mg.html 原文提供 欢迎转载】什么是函数柯里...

目录 概述 四个示例 示例1：用生日解释Promise基础知识 示例2：一个猜数字的游戏 示例3：从Web API中获取国家信息 示例4：从Web API中获取一个国家的周边国家列表 总结 概述 一般在开发中...

目录 前言 SessionStorage和LocalStorage简介 如何使用SessionStorage和LocalStorage LocalStorage与SessionStorage的区别 安全性说明 应对跨站点脚本攻击（XSS） 如何避免攻击？ 对用户体验的提升 使用存储...

是这样的，今天玩github，先是在没有登录浏览了一些页面，然后在某一页面进行了登录。这时再切换的其他页面时就看到了下面的提示： 那么这是怎么做到的呢？我们可以想到，一种办...