- 博客(54)
- 收藏
- 关注
RSS订阅
原创 常用数组方法总结
文章目录常用的方法数组遍历数组的过滤数组的合并检测数组中所有元素是否符合条件查找符合条件的第一个元素查找符合条件的第一个元素下标提取数组中的数组数组转字符串映射计算删除数组中是否包含指定元素数组排序截取常用的方法1、unshift()头部添加，可以添加多个，返回添加后数组的长度 let arr = [1,2,3]; let arr1 = arr.unshift(4,5); console.log(arr); // [4,5,1,2,3] con
2021-05-25 20:35:07
190
6
原创 一些小技巧和一些方法
怎么判断一个对象是否为空封装一个函数，使用 for i 这个循环，如果进这个循环，说明这个对象不是空，如果没进入这个对象则说明是空对象 function flag(obj) { const pay = obj; for (let i in pay) { return obj; } return false; }或者使用ES6新增的方法，Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组。我们可以依
2021-05-12 17:06:05
109
原创 git提交规则及报错
报错subject may not be empty [subject-empty]type may not be empty [type-empty]git commit规范subject may not be empty [subject-empty]type may not be empty [type-empty]✖ 主题不能为空[主题为空]✖ 类型不能为空[类型为空]git commit 又一定规范，需要按照规范来提交在git commit -m “” 时，要使用 type: xxxx
2022-03-17 15:48:02
3475
原创 前端生成二维码/下载zip文件
1、下载一个工具qrcode<template> <button @click="ClickQrcode">生成二维码</button></template><script>// 引入 qrcodeimport QRCode from "qrcode";// 下载成压缩包import JSZip from "@/assets/js/jszip.min.js";// 引入图片转换 // base64ToBlob >
2021-12-21 16:14:28
522
原创 mac电脑安装nvm
1、首先卸载掉电脑中的全局node/npm显示隐藏文件：defaults write com.apple.finder AppleShowAllFiles Yes && killall Finder隐藏隐藏文件：defaults write com.apple.finder AppleShowAllFiles No && killall Finder按住shift+command+g 打开 /用户/local/bin 这个文件，找到自己的文件夹进入到当前
2021-12-06 11:53:10
865
原创 发布到服务器
首先打包下面这个是我项目的打包npm run b:uat “b:uat”: "cross-env fmt_env=uat node build/build.js "去官网下载一个FinalShell打开之后点击左上角的文件夹图标在点击左上角SSh链接之后输入账号密码即可名称随便写。主机连接服务器的ip，用户名使用登陆服务器的用户名和密码，点击确定即可连接。...
2021-11-17 17:53:27
512
原创 vue+element上传图片文件转base64数据
<template> <el-upload ref="upload" action :on-change="onChange" :limit="3" list-type="picture-card" :before-upload="beforeAvatarUpload" :http-request="upl
2021-08-25 19:17:14
755
原创 csv文件的导入与导出
文章目录导入导出导入<template> <!-- 导入 --> <div class="home"> <el-upload class="upload-demo" action accept=".csv" :auto-upload="false" :on-change="onChange" :before-upload="beforeAvatarUpload" &g
2021-08-11 14:36:41
671
原创 vue+element实现导入xlsx文件
导入使用到的插件xlsxelementvue页面代码<template> <div> <el-upload class="upload-demo" action accept=".xlsx, .xls" :auto-upload="false" :on-change="onChange" > <el-button size="small" type="prima
2021-08-04 18:26:15
276
原创 element一些属性或方法
element1、from表单1、from表单this.$refs["ref"].resetFields(); // 清除表单验证结果以及重置
2021-07-31 10:11:00
395
5
原创 element按需引入都有哪些组件
import Vue from 'vue'import { Input, Button, Menu, MenuItem, MenuItemGroup, Submenu, Breadcrumb, BreadcrumbItem, Table, TableColumn, Switch, Pagination,Dialog,Form,FormItem,Message,Popconfirm ,Row,Col,Select,Option,Tag ,Tooltip,Tree,MessageBox}
2021-06-15 15:52:01
388
1
原创 element表格树形结构
1、首先我们要复制一个模板<template> <div> <el-table :data="tableData" style="width: 100%; margin-bottom: 20px" border> <el-table-column prop="date" label="日期" > </el-table-column> <el-table-co
2021-06-08 20:30:02
1188
1
原创 elemeng-ui中表单如何校验
一、首先我们引入element1、下载npm i element-ui -S2、引入我们这里直接完整引入了，按需引入请看element官网在main.js中写入以下内容import Vue from 'vue';import ElementUI from 'element-ui';import 'element-ui/lib/theme-chalk/index.css';import App from './App.vue';Vue.use(ElementUI);new Vue({
2021-06-08 00:38:27
115
原创 ngnix服务器配置
1、下载下载ngnix2、启动我们把下载好的压缩包解压到一个文件中，然后到这个文件中使用命令面板（1）start nginx 开启nginx服务（2）nginx.exe -s stop 关闭nginx服务，快速停止nginx，可能并不保存相关信息（3）nginx.exe -s quit 关闭nginx服务，完整有序的停止nginx，并保存相关信息(4) nginx.exe -s reload 重载nginx服务，当你改变了nginx配置信息并需要重新载入这些配置时可以使用此命令重载nginx
2021-06-08 00:24:22
305
原创 vue项目使用Nginx解决history路由模式白屏
1、首先我们去下载NginxNginx2、写在完成后我们解压到一个文件中。注意：解压的路径不能有中文3、我们打开conf文件下面有一个nginx.conf文件，我们需要修改它的配置。4、找到location /修改为location / { root html/dist/; try_files $uri $uri/ /dist/index.html; index index.html;
2021-06-07 10:40:53
461
原创 webpack打包优化
文章目录1、路由懒加载2、关闭生产环境下的SourceMap映射文件3、使用CDN加速优化4、去除console.log()打印以及注释1、路由懒加载在配置我们路由时，我们可以使用路由懒加载，当我们切换到这个路由时，才会加载这个页面。我们可以在路由规则中配置如下:{ path: '/', // 路由 name: 'Home', // 路由名称 component: () => import("@/views/Home.vue") // 使用这种方
2021-06-06 15:19:51
274
原创 vant-ui 按需引入
一、下载vant1、第一步肯定是下载vant啦// Vue 2 项目，安装 Vant 2：npm i vant -S// Vue 3 项目，安装 Vant 3：npm i vant@next -S二、 自动按需引入组件 (推荐)这种方式是通过一个插件。babel-plugin-import 是一款 babel 插件，它会在编译过程中将 import 的写法自动转换为按需引入的方式npm i babel-plugin-import -D三、配置在.babelrc 中添加配置注意
2021-06-06 15:07:29
144
原创 vue中封装axios 以及api 统一管理
文章目录一、安装axios二、创建文件夹三、封装axios1、引入axios2、引入vuex3、引入vant4、引入我们的环境变量5、创建axios实例6、添加请求拦截7、响应拦截7、导出封装的axios函数四、api统一管理1、引入我们封装的axios2、使用async/await进行请求优化3、导出五、使用简介axios专门用于我们去请求数据，它本身就支持链式的调用，但是我们写项目的时候，每个页面都会发送请求，如果平凡的调用axios会写很多重复的代码，所以我们统一封装一个方法，我们的域名一个项目一
2021-06-03 16:54:29
674
原创 去哪儿移动端开发过程
文章目录一、确定项目技术栈二、搭建项目1、手动搭建2、使用模板三、路由四、组件化开发五、webpack配置打包优化 （vue.config.js）一、确定项目技术栈技术栈描述版本vuevue.js2.0vue-clivue脚手架3/4vue-routervue路由vuexvue状态管理工具axios异步请求数据vant移动端框架rem自适应布局scssCSS 扩展语言webpack打包工具二、
2021-06-02 09:18:26
327
原创 vue多环境变量
1、第一步首先我们在项目跟目录下找到package.json文件，在scripts中配置"scripts": { "serve": "vue-cli-service serve", // 开发环境 "build": "vue-cli-service build", // 生产环境 "test": "vue-cli-service build --mode testing" // 测试环境 },我们根据不同的启动方式来启用不同的域。2、第二步然后我们在根目录下创建3个文
2021-06-01 21:10:17
245
原创 transition
一、transitiontransition是双标签，包裹要过度的元素/组件，transition只会把过度的效果应用到其包裹的内容上，而不会额外渲染DOM元素，也不会出现在可被检查的组件层级中。二、transition元素的属性name -string，用于自动生成CSS过度类名。例如：name=“fade” 将自动扩展为 .fade-enter ，.fade-enter-active，等。默认类名为 “v”。appear -boolean，是否在初始渲染时使用过度。默认falsecss -
2021-06-01 20:24:42
599
原创 keep-alive
一、keep-alive是什么keep-alive作为双标签使用，当包裹动态组件时，会缓存不活动的组件实例，而不是销毁他们。和transition相似，keep-alive是一个抽象组件，它自身不会渲染一个DOM元素，也不会出现在组件的父组件链中。1、keep-alive属性include 只有名称匹配的组件会被缓存exclude 任何名称匹配的组件都不会被缓存max -数字 最多可以缓存多少组件实例如果不使用属性，则会默认缓存所有组件实例include和exclude的值为路由规则
2021-06-01 20:07:44
393
1
原创 vue中事件委托
什么是事件委托事件委托是把子元素的事件委托给父元素去处理。好处：1、减少事件注册怎么使用事件委托我们事件委托一般都是使用在列表里面的。这里就拿列表举例：我们在每一个循环的标签身上动态绑定一个自定义属性。给统一的父元素绑定事件。在事件中可以通过事件对象来获取自定义属性的值代码<template> <div class="home"> <ul @click="click"> <li v-for="(item,i
2021-05-30 16:03:55
5916
原创 闭包的形式
闭包「函数」和「函数内部能访问到的变量」（也叫环境）的总和，就是一个闭包。如：函数套函数，然后 return 一个函数function foo(){ var local = 1 function bar(){ local++ return local } return bar}var func = foo()func()local 变量和 bar 函数就组成了一个闭包（Closure）。为什么要函数套函数呢？是因为需要局部变量，所以才把 local 放在
2021-05-28 20:22:32
176
1
原创 作用域、作用域链、自由变量、变量提升
文章目录一、作用域1、var、let、const二、作用域链三、自由变量四、变量提升一、作用域一个变量可以使用的范围，就归为一个作用域。全局作用域函数作用域局部作用域定义的变量共有3种方式，且有一定的不同。1、var、let、const共同点：都可以声明一个变量。不同点：var存在变量提升，在全局任何地方都可以访问到。let不存在变量提升，遇到{}是一个作用域。const定义的常量，一旦定义，不可改变其值。不存在变量提升遇到{}也是一个作用域。二、作用域链当我们使用了一个
2021-05-28 18:37:56
99
原创 new的过程
介绍我们通常创建一个构造函数，使用new关键字来new出一个对象，那这个对象是如何产生的呢？步骤：1、在new开始时，创建一个空对象。这个空对象的__proto__属性指向构造函数的prototype属性改变this的指向，指向我们新创建的空对象。返回这个空对象。补充：当我们在第四步的时候，可以判断我们的构造函数有没有返回值，当有返回值时，返回构造函数的返回值，当没有返回值时，返回我们创建的空对象。function Foo(name, age) { this.name = name
2021-05-27 18:49:57
128
原创 this指向和改变this指向
一、this指向1、我们最大的作用域是window，所以在我们的全局中this指向window2、在函数中(普通函数)，this永远指向调用他的那个对象3、在箭头函数中，箭头函数中没有this，使用的this就是箭头函数父级的this。4、在构造函数中，this指向构造出来的实例。注意：箭头函数种的this无法改变二、改变this指向1、apply2、call3、bind...
2021-05-26 20:06:09
359
原创 原型、原型链
一、原型1、prototype每个函数都一个prototype属性，被称之为显示原型。2、__ proto __每个实例对象都有一个proto属性，被称为隐士原型。指向指向构造函数的prototype。prototype 和__proto__是等价的。3、constructor每个prototype原型都有一个constructor属性，指向我们的prototype属性。二、原型链当我们调用属性或方法的时候，首先会寻找自身有没有这个属性或方法，没有找到就去原型上去找，如果还没找到就去
2021-05-26 19:54:01
60
原创 小程序遇见的报错以及解决方法
文章目录一、'mark' of undefined一、‘mark’ of undefined应该是小程序使用了ES7语法，没有开启增强编辑。解决：开启增强编译
2021-05-26 18:56:19
655
1
原创 arguments
什么是arguments1、argument特点arguments只在函数中存在。(箭头函数除外)arguments是一个伪数组。是一个集合，存储了我们传入的所有形参。arguments具有length，可以通过下标访问。注意：伪数组不能使用数组的方法2、arguments方法1、arguments.callee()方法这个方法可以调用方法本身补充：伪数调用数组的方法1、转换为真正的数组使用展开运算符function fn (){let arr = [...arg
2021-05-25 19:26:34
169
1
原创 常用数据类型判断
1、判断数据类型首先要知道都有哪些数据类型。数据类型第一种、typeof语法:let str = ""console.log(typeof str);判断一个变量是什么类型的。注意：尽量用来判断简单数据类型，除了null，null判断出来是object，判断object和array都会返回object第二种、instanceof语法:var c= [1,2,3];console.log(c instanceof Array) //true// 要判断的变量 instanceof 数
2021-05-24 20:20:15
172
2
原创 js数据类型
一、数据类型数据类型分为2种基本数据类型：String Null Number Boolean Undefined引用数据类型：Object。包含Object、Array、 function、Date、RegExp。备注： 基本数据类型，又称值类型。1、基本数据类型基本数据类型都存储在栈里，且基本数据类型都是深拷贝。2、引用数据类型。引用数据类型都存储在堆里，在栈中有一个id指向堆中的数据。注意：当拷贝引用对象时，拷贝的只是栈中的id，并没有形成新的数据，当我们改变任意一个变量中的
2021-05-24 20:02:44
128
原创 深拷贝
在学习深拷贝之前，我们要先搞明白什么是深拷贝？在JS中，数据类型分为基本数据类型和引用数据类型两种，对于基本数据类型来说，它的值直接存储在栈内存中，而对于引用类型来说，它在栈内存中仅仅存储了一个引用，而真正的数据存储在堆内存中。1、当我们对数据进行操作的时候，会发生两种情况基本数据类型var a = 3;var b = a;b = 5;console.log(a); // 3console.log(b); // 5可以看到的是对于基本类型来说，我们将一个基本类型的值赋予 a 变量，接着将
2021-05-22 15:30:37
144
原创 vue-ruoter路由
认实vue-routervue-router是Vue.js官方的路由插件，它和vue.js是深度集成的，适合用于构建单页面应用。我们可以访问其官方网站对其进行学习: vuex.jsvue-router是基于路由和组件的路由用于设定访问路径，将路径和组件映射起来。在vue-router的单页面应用中, 页面的路径的改变就是组件的切换。vue-router路由是什么路由，其实就是指向的意思，当我点击页面上的home按钮时，页面中就要显示home的内容，如果点击页面上的about 按钮，页面中就要显示a
2021-05-22 15:18:59
403
5
原创 vuex
vuex是什么vuex 是一个专门为vue.js应用程序开发的状态管理模式。这个状态我们可以理解为在data中的属性，需要共享给其他组件使用的部分。也就是说，是我们需要共享的data，使用vuex进行统一集中式管理。vuex中有5个基本对象state 存储状态（变量）mutatis：修改状态，并且是同步的，在组件中使用$store.commit(“事件名”,可以发送参数);来调用，这个和我们组件中的自定义事件类似。actions：异步操作，在组件中使用$store.dispath(“事件
2021-05-22 14:30:51
348
原创 uni-app项目小程序
文章目录一、准备工作一、准备工作1、创建模板我们右击文件夹，选择新建，然后选择项目，然后选择我们的uni-app，项目名称需要填写。这样我们就创建好一个项目的模板了。项目中创建好的文件大概有：pages文件夹：用来保存我们的页面static文件夹：用来保存我们的静态资源app.vue文件：一般用来设置我们的全局样式main.js文件：我们的vue实例，如果需要挂载全局的方法或属性，就在main中挂载选型上。manifest.json文件：我们小程序的一些配置pages.json文件
2021-05-21 00:14:04
595
1
原创 vue生命周期
文章目录一、实例创建之前/实例创建之后二、实例挂载前/实例挂载后三、视图更新前/视图更新后四、实例销毁之前/实例销毁之后我们每个vue文件，都可以看作成一个实例，从加载到销毁。下面我就简单的简述一下我们vue的一生，在那个时间段能做什么事情。我们vue的生命周期大致有8个分别是：实例创建前/后、组件挂载前/后、视图更新前/后、实例销毁前/后。一、实例创建之前/实例创建之后1、beforeCreate()我们vue实例创建之前执行的函数。这个时候只有一些实例本身的事件和生命周期函数2、creat
2021-05-20 16:16:04
216
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人