- 博客(85)
- 收藏
- 关注

原创 容易出错的js面试题目
js原型对象继承 // 函数表达式 var f = function () { this.s = 8 f.prototype.s = 6 } console.log(new f().s) //8 // 函数声明 function Func() { this.name = 1111 console.log(this) } ...
2019-08-21 14:51:47
251

转载 数组中的对象去重方法(使用时将我的参数数组改成你自己的就可以了)
项目开发过程中经常会处理数据,其中数组中的对象去重是最凡人的,今天笔者就将数组当中的对象去重方法分享给大家,大家使用的时候只需要调用这个方法,传入你要去重的数组以及对象的唯一值就可以了。PS:笔者封装的这个方法不论是参数是对象还是普通的数字或者字符串都可以实现去重// 首先搞三个数组用来待会测试// 要进行去重的数组const arr = [ { id: 1, name: ...
2019-08-16 11:49:36
194

原创 JS深浅拷贝
深浅拷贝定义浅拷贝 只是复制了对象的引用地址,两个对象指向同一个内存地址,所以修改其中任意的值,另一个值也会随之变化 深拷贝 将对象及值复制过来,两个对象修改其中任意的值另一个值不会改变 面试中可以这样说,浅拷贝是拷贝一层,深层次的对象级别就拷贝引用,深拷贝是拷贝多层,每一层的数据都会拷贝// 深拷贝 number string boolean null undefined ...
2019-08-14 10:43:25
103

原创 JS中数组常见的操作方法
js中常见的数据类型 // 基础类型: String // 字符串 Number // 数字 Boolean // 布尔值 Null // 空对象 Undefined // 末定义 Symbol //new in ES 6 // 引用类型: Object // 对象 Array // 数组 Func...
2019-08-02 15:44:36
133

原创 整理Vue项目开发过程中遇到的常见问题1
element UI表格排序sortable最简单的按大小排序,需要添加prop,不然无法使用表格后面增加的sortable没有作用解决办法:没有给表格添加prop属性<el-table-column align="center" label="闸门名称" prop='gatename' sortable> ...
2019-07-30 18:25:30
14617

原创 Vue 项目启动后出现常见的警告 错误解决办法
1.There are multiple modules with names that only differ in casing.This can lead to unexpected…原因:文件名和引用不一致,一个大写字母,一个小写字母,举个例,文件名是App.js,但是你引用的时候是写的app.js…’@/api/oa/workingHours/aWorkinghoursAllowe...
2019-06-20 13:49:17
12031
原创 Mac Flutter web环境搭建
注意:这里由于我开发web端,所以就没有安装Xcode和Andriod Studio了。// 这个命令配置了PATH环境变量,且只会在你当前命令行窗口中生效。// 加入这个, 然后保存 `Shfit` +` : ` 然后 wq。source ~/.bash_profile 更新环境变量。//如果想让它永久生效,请用以下更新 PATH 环境变量。vim ~/.bash_profile 编辑环境变量。echo $PATH 查看设置好的环境变量。
2023-08-22 16:41:53
835
原创 Vue.extend()实现Delete二次确认弹窗
DeletePrompt组件的vue单文件<template> <el-dialog :show-close="false" top="35vh" :visible.sync="visible" :close-on-click-modal="false" :close-on-press-escape="false" width="360px" > <div class="flex y-center prom.
2022-03-15 11:26:04
1724
原创 啥是前端开发工程师必会的5种网页布局方法?
静态布局、自适应布局、流式布局、响应式布局、弹性布局等的概念和区别html响应式弹性布局,布局的几种方式(静态布局、自适应布局、流式布局、响应式布局、弹性布局
2022-02-17 16:03:11
264
原创 js中可选链(?.)与非null赋值(??)的用法
一、可选链 ?.一般在编写代码时,当从异步数据中取一些结构比较深的字段时,一般人写法是这样的:data[0].userInfo.name但是如果当接口返回的data为空数组时,此时就会报一个常见的错误:有经验的开发人员会这样写来避免报错data && data[0].userInfo && data[0].userInfo.name这样即使userInfo为空,也避免报错。还有一种写法就是使用可选链:data[0]?.userInfo?.name.
2021-08-09 14:20:39
477
原创 JavaScript编写精简的条件语句
条件判断是项目开发过程中最常编写的代码,if/else 应该是使用得最多的,但是如果业务比较复杂的话,大量嵌套的 if/else 必将使得代码可读性变差,也不易维护。今天我们就来了解下更加简洁的条件判断语句吧~一、Array.includes当我们需要对多个条件进行判断的时候,Array.includes 是不错的选择。function PrintStudents(student) { if (student === "Tom" || student === "Mike" || stu
2021-08-09 13:50:47
233
原创 Vue 的 class 组件介绍(vue-property-decorator)
基于TS, vue-class-component类组件的基本结构<script lang="ts">import { Vue, Component } from "vue-property-decorator"import { LocaleMessageObject } from "vue-i18n"import { Prop } from "vue-property-decorator"import { CommonObject } from "@/models/comm...
2021-07-22 11:51:10
590
原创 lodash中一些比较常用的方法__Vue.js
无意间看到了公司项目中同事有用到lodash的方法就看了一下,它内部封装了诸多对字符串、数组、对象等常见数据类型的处理函数,Lodash 通过降低 array、number、objects、string 等等的使用难度从而让 JavaScript 变得更简单。可以直接调用,比如数组去重,防抖函数等等,这样可以简化很多代码。lodash的方法有很多,官方文档都有说明,文章中提到的是我平时用到的会比较多的一些方法。 Array:适用于数组类型,比如填充数据、查找元素、数组分片等操作 Col
2021-07-02 17:16:26
498
转载 如何快速了解一个新的前端项目?
快速浏览项目目录结构 首页登陆流程,快速了解项目数据流转 查看package.json文件,快速了解项目技术栈 查看vue.config.js文件,快速了解API请求地址 查看router文件夹,思考怎么增加菜单和页面? 查看request文件夹,快速了解接口请求和响应拦截以及错误信息统一提示 查看component文件夹,快速了解项目的公共组件,代码复用 查看store文件夹,快速了解项目全局变量 查阅项目基础文档,快速了解项目代码规范,测试环境部署等在接受一个新的项目后,要想快速.
2021-07-02 11:07:42
3420
1
原创 Vue3.0 新特性以及使用变更总结(实际工作用到的)
前言Vue3.0 在去年9月正式发布了,也有许多小伙伴都热情的拥抱Vue3.0。去年年底我们新项目使用Vue3.0来开发,这篇文章就是在使用后的一个总结, 包含Vue3新特性的使用以及一些用法上的变更。为什么要升级Vue3使用Vue2.x的小伙伴都熟悉,Vue2.x中所有数据都是定义在data中,方法定义在methods中的,并且使用this来调用对应的数据和方法。那Vue3.x中就可以不这么玩了, 具体怎么玩我们后续再说, 先说一下Vue2.x版本这么写有什么缺陷,所以才会进行升级变更的。
2021-05-25 14:56:32
901
原创 JS中Class类的详解
概述 在ES6中,class (类)作为对象的模板被引入,可以通过 class 关键字定义类。它可以被看作一个语法糖,让对象原型的写法更加清晰、更像面向对象编程的语法。 类实际上是个“特殊的函数”,就像你能够定义的函数表达式和函数声明一样,类语法有两个组成部分:类表达式和类声明。严格模式 类和模块的内部,默认就是严格模式,所以不需要使用 use strict 指定运行模式类的声明定义一个类的一种方法是使用一个类声明,即用带有class关键字的类名(这里是“Rectan
2021-01-11 13:32:45
14825
原创 react中对import React,{Component} from ‘react‘写法的解释,以及react中常见import的用法
一.对import React,{Component} from 'react’写法的解释 首先关于一下写法①的解释①import React,{Component} from 'react'作用相当于下面②和③这两句话②导入react模块(组件)中的默认组件,并且命名为Reactimport React from 'react'③成员导入(member import 、named import): 引入react文件中的成员组件Component,可以用{}形式引入多个成员
2020-12-02 17:53:21
1080
4
原创 [ react app环境搭建 ] ---- 使用npx create-react-app my-app 报错
问题简述根据react文档上安装命令行npx create-react-app my-app, 但是出现报错信息。信息如下解决方法, 先全局安装create-react-app脚手架,然后再执行官网三npm install -g create-react-app npx create-react-app my-app cd my-app npm start...
2020-12-02 16:05:34
3686
3
原创 React入门----- Create-React-App 环境搭建及项目目录介绍
Create React App是FaceBook的React团队官方出的一个构建React单页面应用的脚手架工具。它本身集成了Webpack,并配置了一系列内置的loader和默认的npm的脚本,可以很轻松的实现零配置就可以快速开发React的应用。...
2020-12-02 13:18:48
246
原创 promise执行顺序总结
面试遇到的promise的执行顺序问题,在这里,总结下。之前博客的账号忘记了,新建了一个。 const promise = new Promise((resolve, reject) => { console.log(1); resolve(); console.log(2); }) promise.then(() => { conso...
2020-03-26 14:11:16
1100
原创 vue + element-ui 制作tab切换(切换vue组件,踩坑总结)
本篇文章使用vue结合element-ui开发tab切换vue的不同组件,每一个tab切换的都是一个新的组件。1、vue如何使用element-ui上一篇文章已经分享了如何在vue中使用element-ui创建tab组件切换内容(需要了解的朋友点击链接查看)2、创建相应文件。 a、创建父组件 src/components/tabZujian.vue b、创建自组件(被切换的...
2020-01-12 16:14:54
1324
原创 深入理解vue中的slot与slot-scope
<div class="tmpl"> <span>菜单1</span> <span>菜单2</span> <span>菜单3</span> <span>菜单4</span> <span>菜单5</span> <span>菜单6&l...
2020-01-09 16:47:16
227
原创 vue+element-ui实现表格编辑
动态生成表格模板 <el-table max-height="400" :data="tableData" stripe style="width:100%;" class="tb-edit" @row-dblclick="row_dblcli...
2020-01-08 17:02:16
430
原创 vue父子组件生命周期执行顺序
加载渲染过程父beforeCreate -> 父created -> 父beforeMount -> 子beforeCreate -> 子created -> 子beforeMount -> 子mounted -> 父mounted子组件更新过程父beforeUpdate ---> 子beforeUpdate ---> 子updat...
2020-01-08 17:01:31
191
原创 Vue组件缓存引起的表单校验问题
需求从列表页面跳转到详情页面,再切换到列表页面,列表页面需要保持跳转之前的状态,假设列表页面已被设置缓存问题1:从列表页面单击list跳转到详情表单页面,表单出现红框提示(表单页面一进来就校验 )问题2:表单字段需要动态校验,编辑表单时显示不必填,新建表单时要显示必填问题3:返回列表页面需要重新加载树形控件数据问题4:页面跳转表单字段不清空,还是会保持上一次编辑过的数据在mo...
2020-01-05 14:29:10
627
原创 组件不渲染 el-popover 添加class和设置宽度无效
需求在穿梭框列表里面给每条数据最右边增加一个小图标,鼠标放上去显示一个提示信息,鼠标单击弹出一个模态框显示列表信息详情,因详情内容比较多,需要把它做成一个可复用的组件来引入,并给组件设置一个宽度,且设置的宽度只在该组件内有效,不能影响其它的组件Q1:组件通过懒加载的方式导入,页面第一次进来单击小图标,组件内容不显示,关闭页面后重新打开内容可以正常显示Q2:直接修改它的默认样式会影响其它地方...
2020-01-05 13:45:00
9158
1
原创 VS Code 新版常用配置Setting及常用插件截图
{ // "workbench.editor.enablePreview": false, // 打开文件不覆盖 "search.followSymlinks": false, // 关闭rg.exe进程 // "editor.minimap.enabled": false, // 关闭快速预览 // "files.autoSave": "afterDelay", // 打开自动...
2020-01-05 11:40:06
995
原创 git 分支简单的代码提交流程
gitstatus//命令用于显示工作目录和暂存区的状态 gitadd.//命令用于将工作区中所有未跟踪或者修改的文件添加到暂存区,不包含删除的文件(注意最后的"."前面有个空格,.代表当前目录) gitcommit-m"xxx"//命令用于把暂存区的文件提交到本地(xxx为本次提交代码的备注) gitpulloriginmaster//命令用...
2020-01-05 11:33:47
766
原创 vscode svn安装和使用
1、安装svn插件2、安装成功后会出现这样的图标如果没有安装之后不能使用,请看这篇博客。https://blog.youkuaiyun.com/enter89/article/details/853026423、使用方法点击svn图标,会出现本版本的文件,以及所有提交的版本。我们直接可以在这里查看。点击这个按钮。会跳转到这个界面,里面会显示所有的changes,...
2019-12-05 18:46:26
17645
原创 npm run dev启动过程
npm run *** 是执行配置在package.json中的脚本,比如"scripts": { "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js", "start": "npm run dev", "lint": "eslint --ext .js,....
2019-12-05 17:45:52
1306
原创 学习Vue中那些正则表达式
正则用法JavaScript中正则表达式用法为:/正则表达式特殊字符/修饰符(可选)特殊字符这里列一下正则的特殊字符及其用法,加深理解和映象。* \ 将字符变为特殊或非特殊字符。如 n 变为换行符 \n,特殊符号 ( 变为字符 \(。* ^ 匹配字符串起始位置。* $ 匹配字符串结束位置。* * 匹配前面的子表达式零到多次。* + 匹配前面的子表达式一到多次。...
2019-12-03 17:55:51
1518
原创 常用正则表达式
runoo+b,可以匹配runoob、runooob、runoooooob等,+号代表前面的字符必须至少出现一次(1次或多次)。 runoo*b,可以匹配runob、runoob、runoooooob等,*号代表字符可以不出现,也可以出现一次或者多次(0次、 或1次、或多次)。 colou?r可以匹配color或者colour,?问号代表前面的字符...
2019-12-03 14:53:15
1588
1
原创 ElementUI+Vue 解决在使用el-dialog时,点击el-dialog外的其他区域会导致该对话框关闭
需求描述今天,在做Element+Vue项目时遇到一个需求:甲方要求在Dialog打开状态下,点击该Dialog以外的区域会导致该Dialog关闭;正确的状态应该是只有在点击关闭按钮,或者是Dialog内的其他操作性按钮才能使得Dialog的状态变为关闭。弹窗关闭后还显示一层遮罩层,设置append-to-body即可问题分析之所以会产生这种问题,是因为elementUi在...
2019-12-03 10:15:55
5223
1
原创 Vue 路由切换时页面刷新页面
第二次进入页面,页面路由参数已经改变,但是页面内容不会刷新。问题原因:在组件mounted钩子中调用的刷新页面内容,但测试发现这个钩子没有被调用。后来发现App.vue中使用了<keep-alive>:<template> <div id="app"> <keep-alive> <router-view>...
2019-11-28 19:55:32
16945
原创 VSC配置--自动格式化ESLint
{ "editor.fontFamily": "Consolas, 'Courier New', monospace,'宋体'", // 以像素为单位控制字号。 "editor.fontSize": 14, // 控制选取范围是否有圆角 "editor.roundedSelection": false, // 建议小组件的字号 "editor.suggestFontS...
2019-11-20 16:32:19
641
原创 ES6数组新增方法forEach、map、filter、find、every、some、reduce的用法
*ES6语法:Opera 11+Firefox 3.6+Safari 5+Chrome 8+Internet Explorer 9+支持。可以通过babel转意支持低版本浏览器。forEach()ES6新增的一种循环案例1打印数组中所有对象numbers=[1,2,3,4,5]numbers.forEach(number => { ...
2019-11-14 12:26:12
143
转载 ES6:生动形象解释forEach、filter、map、some、every、find、findIndex、reduce间的区别
前言从最开始学的for循环遍历方法,到后来层出不穷的各种遍历方法,其实最大的区别就是应用场景的不同。我们最需要记住的就是,什么情况下用哪一种方法比较合适。从挑土豆开始这里有一堆土豆,如果换成代码,可以表示如下:var potatos = [{ id: '1001', weight: 50 },{ id: '1002', weight: 80 },{ id: '1003', we...
2019-11-14 11:42:31
336
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人