- 博客(35)
- 资源 (1)
- 收藏
- 关注
RSS订阅转载 10个JS实用优化小技巧
Write Less Do the Sameif多条件判断// 冗余if (x === 'abc' || x === 'def' || x === 'ghi' || x ==='jkl') {}// 简洁if (['abc', 'def', 'ghi', 'jkl'].includes(x)) {}if…else…// 冗余let test: boolean;if (x > 100) { test = true;} else { test = fals
2021-02-01 11:55:46
235
1
转载 vue 项目中播放视频展示 插件vue-video-player
安装插件npm install vue-video-player -S在 main.js 入口文件导入import VideoPlayer from 'vue-video-player' import 'video.js/dist/video-js.css'import "vue-video-player/src/custom-theme.css";Vue.use(VideoPlayer)在单文件组件中使用import "video.js/dist/video-js..
2021-01-29 15:50:44
886
原创 vue 中父子兄弟通信最简单的例子 包学包会
1、父子组件通信父组件<father @fatherMethods="close"> <son ref='son' :fatherValue='value'></son></father>private value = '我是你爸爸'; // 要传给子组件的值// 父取子方法private getSonMethods () { (this.$refs.son as son).open() // 使用 ref 取到 子组件的方法 注 ref
2021-01-20 15:50:02
397
3
原创 vue + element 分页组件使用 以及实现刷新后页码不掉
1 分页组件初步介绍分页组件最主要的参数有三个current-page 当前页数,也就是当前的页面的页码,这是刷新后仍在当前页的关键参数page-size 每页显示条目个数，注意别和 page-size 搞混total 总条目数 就是所有数据的总量注: 以上参数的值皆为 number 类型,为什么要强调这个呢?因为在刷新的时候会用到其余的参数~ background boolean 是否为分页按钮添加背景色~ layout string 组件布局，子组件名用逗号分隔~ current-c
2021-01-20 14:51:07
3944
4
原创 vue + element 导航点击不失色
逛了一圈论坛，发现都是复制粘贴的，好多都是用 sessionStorage 做的。参考帖子：sessionStorage 实现 点击导航不失色当时我也是按这种方法做的，做的时候没问题，到测试时候问题就大了，首先出现的问题就是，在页面比较多的情况你得在跳转的同时存上这个状态，比如...
2021-01-19 15:40:07
5092
2
原创 webstorm运行巨卡,打字延迟
卡的话主要有两种情况1 本来就卡,现在还卡.那就基本是内存的问题了,webstorm在运行时候会占用的大量内容,所有会卡,要么加内存,要么打卡webstorm的文件夹，bin文件夹，里面有个WebStorm.exe.vmoptions，我们用记事本打开它.修改xms 的值保存,1000左右就够了了2 本来不卡,最近卡了,打开其他项目不卡,就打开这个项目卡,网上什么索引啊什么的,讲了一堆,这里我给大家介绍一个终极无敌傻瓜式解决方案,一步搞定.那就是那打开你的项目文件夹删除 .idea 这个文件夹即可,
2021-01-19 10:33:15
1984
1
原创 Vue基于Element-UI 电商管理项目
项目概述开发模式前后端分离：前端调接口，后端写接口技术选型前端1.vue2.vue-router3.element-ui4.axios5.echarts后端1.node.js2.express3.jwt4.mysql5.sequelize项目初始化11 安装 vue 脚手架2 vue 脚手架创建项目3 配置 vue 路由4 配置 element-ui 组件库5 配置 axios 库6 初始化 git 远程仓库7将本地项目托管到 github 或者码云上2
2020-11-27 00:44:00
697
原创 vue-router 重定向和别名 理解
重定向一般来说，path 值对应什么如A，url 就对应A，如果将 path 值改变为B，如果还想访问，就必须将 url 改成B才可以，若还是按照未改变之前的A访问，那么页面将是一篇空白，想要之前的A来访问现在的B，就需要在路由中再添加一条 redirect{ path: '/A', redirect:{ path: '/B' }}别名可以通过别名来访问 也可以通过路径 直接省略前面，可以直接用别名访问，适合在路由比较复杂的情况下使用...
2020-11-27 00:43:43
277
原创 vue - element 组件开发
ElementElement，是由饿了么UED设计一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库今天我要分享的就是在开发时使用 Element 的一些心得。官网：http://element.eleme.io/#/github：https://github.com/ElemeFE/element设计原则设计目的设计阶段...
2020-11-18 19:46:57
1954
2
原创 Echarts 显示相关学习
主题内置主题：默认 light dark在初始化方法 init 中可以指明var chart = echarts.init(dom,'light');var chart = echarts.init(dom,'dark');自定义主题自定义主题编辑器中编辑主题下载主题，是一个 js
2020-11-09 09:57:23
88
原创 Echarts 基本图学习
柱状图通用配置 tooltip提示框组件，可以配置鼠标滑过或点击图表时的显示框 增加划过时提示1、触发类型：triggeritem 移动到内部时触发显示内容axis 鼠标在y轴上就可以触发显示内容2、触发时机：triggerOnmouserover 鼠标移动触发提示内容click 点击触发提示内容3、格式化：formatter 字符串模板回调函数通用配置 toolboxecharts 提供的工具栏内置有导出图片、数据视图、动态类型切换、数据区域缩放、重置五个工具toolbox
2020-11-06 19:49:08
457
原创 Vue 基础
methods可以在试图中通过 {{}} 调用方法可以通过 vm 对象.方法名去调方法 vm.fn1()方法种得 this 指的是当前 Vue 实例对象。不推荐写箭头函数，因为箭头函数 this 指向不是 vm 实例可以通过指令调用方法 @click=“fn1()”插值表达式作用：将绑定的数据实时显示出来，通过任何方式修改所绑定的数据，所显示的数据都会被实时替换。注意：{{ }} var = 1 if for 都不能写在插值表达式中。指令Directives 是带有 v- 前缀的特
2020-11-01 21:44:31
333
1
原创 Storage 封装
Cookie、localStorage、sessionStorage 三者区别存储大小：Cookie4K、Storage5M有效期：Cookie 拥有有效期，Storage 永久存储Cookie 会发送到服务器端，存储在内存中，Storage 只存储在浏览器端路径：Cookie 有路径限制，Storage 只存储在域名下API：Cookie 没有特定的API，Storage 有对应的API为什么要封装 StorageStorage 本身有API，但是知识简单的key/value 形式S
2020-10-27 11:35:27
214
原创 JS ES6 箭头函数
箭头函数使用“箭头”（ => ）定义函数。var f = v => v;箭头函数特性函数体内的 this 值，绑定的定义时所在的作用域的 this不可以当作构造函数不可以使用 arguments 对象function fn (){}// 语法：()=>{}var f = () = {console.log(123)}f() // 123var add = () => 2;add()console.log(add()); // 2函数参数默认值给
2020-10-22 11:02:22
163
原创 JS ES6 解构赋值
解构赋值ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构。数组的解构赋值let [a, b] = [1, 2] // a = 1, b = 2let [a, b, c = 100] = [1, 2]对象的解构赋值let {hello, world} = {hello: 1, world: 2}let {hello = 1, world} = {world: 2}let {hello:w, world} = {world: 2}字符串的结构赋值函数参数的解构
2020-10-22 10:35:01
399
原创 JS ES6 声明变量的方式let、const
声明变量关键字varletconstlet 特性不允许重复声明不存在变量提升块级作用域 暂存死区（从块的开始到声明这段的区域）var 声明的变量由函数划分作用域let 声明的变量由代码块划分作用域const 特性特性同 let声明一个制度的常量，一旦声明，常量的值就不能改变...
2020-10-22 10:07:31
130
1
原创 Http协议
ip：规定了互联计算机之间定位规则tcp：规定了互联计算机通过 ip 定位后，发送数据的规则端口ip -> 定位主机端口 -> 软件，应用在数据发送过程中除了要有具体发送的数据，还有一些其他额外的数据，比如：接收和发送人的 ip、端口，为了能让接收数据的乙方能够按照数据反馈信息给对方。同时在发送过程中数据会按一定规则打包，比如将大的数据打包成一个一个小的数据包，每个数据包都包含如上的一些信息。A ->BA 发送的数据： ‘dasfdafa’{192.168.0.1 | 77
2020-10-20 17:35:05
94
原创 JS ES6 函数的扩展
1、为函数参数指定默认值function fn(a = 10, b =20){ console.log(a + b); // 30}fn()2、函数的 rest 参数rest 参数形式为（“…变量名”），用于获取函数的多余参数，这样就不需要使用 arguments 对象了。rest 参数搭配的变量是一个数组，该变量将多余的参数放入数组中。function sum(){ var args = arguments; var res = 0; for(var i = 0; i<args
2020-10-20 15:13:16
243
原创 JS ES6 内置对象的扩展
字符串的扩展模板字符串将字符串放在反引号： ` 中1、repeat 对字符串进行重复操作let str1 = 'a';let str2 = str1.repeat(6);console.log(str2); // aaaaaa2、includes() 判断字符串内是否有指定字符串startsWith() 查找开头是否有指定字符串endsWith() 查找结尾是否有指定字符串let str = 'hello';console.log(str.includes('ll')); //
2020-10-20 14:39:43
183
原创 JS ES6 Symbol详解
什么是 Symbol ？Symbol，表示独一无二的值，是 js 中第七种数据类型基本数据类型Null Undefined Number Boolean String Symbol引用数据类型Objectlet s1 = Symbol();let s2 = Symbol();console.log(typeof s1); // symbolconsole.log(s1 === s2); // false注意：Symbol 函数前不能使用 new 否则会报错，原因在于 Symbol 是一
2020-10-20 11:34:44
739
原创 数据结构 Set
数据结构 Set集合的基本概念：集合是由一组无序且唯一，就是不能重复的项组成，这种深故居结构使用与有限集合相同的数学概念，应用在计算机的数据结构种。特点：key 与 value 相同，没用重复的 valueES6 提供了数据结构 Set ，类似数组，但是成员的值都是唯一的，没有重复的值。1 创建一个 Setconst s = new Set([1, 2, 3]};console.log(s);2 Set 类属性console.log(s.size); // 33 Set 类的方法1、
2020-10-15 22:07:42
269
原创 JavaScript 中的几种迭代方法
迭代定义：1、迭代（iterate），指的是按照某种顺序逐个访问列表中的每一项。比如，for语句。2、循环（loop），指的是在满足条件的情况下，重复执行同一段代码。比如，while语句。3、遍历（traversal），指的是按照一定的规则访问树形结构中的每个节点，而且每个节点都只访问一次。4、递归（recursion），指的是一个函数不断调用自身的行为。比如，以编程方式输出著名的斐波纳契数列。迭代方法：1、every用来查询数组中的 每一个是否 都 满足某一条件var num = [1
2020-10-15 17:57:14
1805
原创 前端接口增加与修改
首先当然是需要接口文档了，你问我没有接口文档怎么搞，那没啥事了。先说增加的吧，增加就很简单了，找到接口对应的触发事件或者是原接口位置，建议直接找接口对应的触发事件，反正我一开始找原接口找的特费劲，而且容易找错了，那后面基本扯犊子了。所以还是找触发事件好，比如那个接口是点击这个...
2020-10-09 22:48:01
2301
原创 webstorm建立vue-cli脚手架傻瓜式详解
webstorm 文件 -> new -> project1、尽量不要勾选 Use the default project setup (babel, eslint) 默认建立的项目好多的配置不全，后期再装很麻烦。2、点击 create 后出现以下选项，按键盘上下键选择默认（default）还是手动（Manually），如果选择default，一路回车执行下去就行了（注：现在vue-cli3.0默认使用yarn下载），这里我选择手动3、选择配置，这时你会看见一些选项，你要集成什么就选就
2020-09-21 14:32:46
3688
原创 Vue Mixins 学习
Vue Mixins定义：是 vue 中提供一种混合机制，用来高效的实现组件内容的复用。混合对象可以包含任意组件选项。当组件使用混合对象时，所有混合对象的选项将被混入该组件本身的选项。理解：组件被引用后相当于在其父组件开辟了一块单独的空间，根据父组件 props 传递的值进行相应操作，但两者之间相互独立。而 mixins 在引入组件后，则将组件内部内容如 data、method 等属性与父组件相应内容合并，相当于引入后，父组件的各种属性都被扩充了。单纯组件引用：父组件 + 子组件 >>
2020-09-18 15:11:18
106
原创 TypeScript学习记录
TypeScript是 JS 的一个超集，并支持 ESC6 标准微软开发，自由开源TS 设计目标是开发大型项目用，可编译为纯 JS ，并可运行在任何浏览器上语言特性：TypeScript 是一种给 JavaScript 添加特性的语言扩展。增加的功能包括：类型批注和编译时类型检查类型推断类型擦除接口枚举Mixin泛型编程名字空间元组Await以下功能是从 ECMA 2015 反向移植而来：类模块lambda函数的箭头语法可选参数以及默认参数TS 与 JS
2020-09-15 09:37:30
414
原创 Git 常用命令速查
Git 常用命令速查master 默认开发分支origin 默认远程版本库Head 默认开发分支Head^ Head 的父提交创建版本库git clone 克隆远程版本库git init 初始化本地版本库修改和提交git status 查看状态git diff 查看变更内容git add .
2020-09-08 09:35:28
116
原创 Vue项目——仿小米商城记录
DAY 1核心技术页面商城首页登陆商城产品站商城详情购物车订单确认订单支付（微信/支付宝）订单列表组件NavHeader（导航组件）NavFooter（底部组件）ServiceBar（服务条组件）ProductParam（产品参数组件）OrderHeader（订单头部组件）Loading（加载组件）Model（弹框组件）NoData（无数据组件）ScanPayCode（支付组件）技术栈Node 环境安装 略Git安装 略Git 配置git config -
2020-09-07 21:54:59
1399
原创 Vue—router
1 路由1.1 后端路由概念：根据不同用户的 URL 请求，返回不同的内容本质：URL 请求地址与服务器资源之间的对应关系1.2 前端路由概念：根据不同的用户事件，显示不同页面的内容本质：用户事件与事件处理函数之间的对应关系1.3 实现简易前端路由基于 URL 的 hash 实现 （点击菜单的时候改变 URL 的 hash，根据 hash 的变化控制组件的切换）Vue-router基本介绍Vue-router是 Vue.js 官方的路由管理器，它和 Vue.js 的核心深度集成，可
2020-08-30 15:28:06
101
原创 Axios
AxiosAxios 是基于promise 的 http 库，可以用在浏览器和 node.js中。Axios特征浏览器创建XMLHttpRequests从 node.js 创建 http 请求支持 Promise API拦截请求和响应转换请求数据和响应数据取消请求自动转换 JSON 数据客户端支持防御 XSRFAxios安装npm install axios引入<script src="https://unpkg.com/axios/dist/axios.min.j
2020-08-30 15:01:54
154
原创 Webpack
webpack概述webpack：模块打包机，分析项目结构，找到JS模块以及一些浏览器不能直接运行的扩展语言，并将其转换和打包为格式的格式供浏览器使用。优点（为什么使用webpack）：模块化，可以使复杂的程序细化为各个小的文件预处理器，可以对Scss，less等css预先进行处理webpack安装npm install webpack-cli -D 安装webpack相关包在项目根目录中，创建名为 webpack.config.js 的 webpack 配置文件...
2020-08-29 15:39:56
239
原创 Vue—组件间的数据交互
父组件向子组件传值1、组件通过props接收传递的值，props值为数组，数组中可包含很多属性，这些属性都是父组件传递过来的Vue.component('menu-item',{ props:['title'], template: '<div>{{ title }}</div>' })2、父组件通过属性将值传递给子组件<menu-item title="来自父组件的数据"></menu-item><menu-item :title="
2020-08-29 10:52:55
360
原创 Git个人常用命令
git status 查看状态和是否存在.git文件git clone xxx@xxx.com/xxx.git 将线上代码克隆到本地桌面git status 查看工作区git add . 新建一个空文件添加到暂存区git commit -m ‘xxx’ 将上空文件提交到版本库（本地仓库） xxx是注释git push 本地代码提交到线上仓库git pull 将线上分支拉到本地git chec
2020-08-28 10:49:10
93
原创 JS-Promise
Promise欢迎你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。新的改变我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，帮助你用它写博客：全新的界面设计 ，将会带来全新的写作体验；在创作中心设置你喜爱的代码高亮样式，Markdown 将代码片显示选择的高亮样式 进行展示；增加了 图片拖拽 功能
2020-08-28 09:14:28
151
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人