- 博客(55)
- 收藏
- 关注
RSS订阅原创 React项目中遇到的问题
营销中心后台管理系统1.译为：由’ useForm ‘创建的实例没有连接到任何Form元素。 忘记传递’ form '道具?Instance created by `useForm` is not connected to any Form element. Forget to pass `form` prop?解决方法：form={form} <Form form={form}> <Form.Item na
2021-11-03 13:50:29
492
原创 Angular8项目中遇到的问题
1. 2021/7/7because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checkin出现的背景：新创建了个页面无法通过路径访问，但可以通过this.router.navigate([’/apple-email’], { queryParams: params });跳转进入该页面，刷新报错，页面不展示。翻译：它的MIME类型(‘text/html’)不是一个支持的
2021-07-07 11:16:41
249
原创 onkeyup input前端限制输入
input 限制输入<!-- οnkeyup="非数字替换并保留两位小数" --><input onkeyup="this.value=this.value.replace(/^\D*([1-9]\d*\.?\d{0,2})?.*$/,'$1')" onafterpaste="this.value=this.value.replace(/^\D*([1-9]\d*\.?\d{0,2})?.*$/,'$1')" [maxlength]="10" pla
2021-05-26 17:16:14
823
原创 react 路由传参
react 路由传参 //跳转带参const goToParames = (path, params) => { history.push({ pathname: path, query: { params }, }); };//接值props.location.query //跳转带参，刷新参数仍在 const goToParames = (path, params) => { history.
2021-03-06 11:04:19
105
原创 css：项目中遇到的样式问题
input { appearance: none;} /* ios去掉内阴影 */body{/* 文本不能被选择*/ -moz-user-select : none; -webkit-user-select: none; }
2021-02-19 11:53:53
115
原创 React项目中遇到的兼容问题(M端适配APP)
M站项目问题描述：1.视频打不开时右上角返回无效，导致无法返回（M站）ios机出现的问题，发现ios14.3、14.4版本正常，ios12版本点击不灵敏后发现原因是有个div 样式visibility：hidden[设置元素不可见]并充满整个屏幕，ios12版本不兼容解决方法：换成display:block2.chat按钮没有固定（M站）ios机出现的问题，发现ios14.3、14.4版本正常，ios12版本不固定底部聊天室按钮须放在最外层就可以了3. M站需要锚点动画
2021-02-19 11:28:50
612
原创 js Number方法汇总
Number方法方法作用说明toFixed()保留两位小数num.toFixed(2)Number()转化为数字Number(num)
2021-02-19 10:02:28
304
原创 JS 时间戳转化
方法集合一、时间戳转换2020-10-22 11:13:32格式const getTime = timestamp => { let date = new Date(timestamp); let Y = date.getFullYear() + '-'; let M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-'; let D = date.get
2021-01-19 16:53:02
73
原创 git命令遇到的错误及解决办法
1.warning: LF will be replaced by CRLF in翻译：警告:if将被CRLF替换背景：AngularM站项目gitLab上传时原因：是存在符号转义问题，windows中的换行符为 CRLF， 而在linux下的换行符为LF，所以在执行add . 时出现提示，解决办法：解决办法：指令：git config --global core.autocrlf false...
2020-12-26 21:33:21
164
原创 前端性能优化
性能优化：+ 1. 减少请求数量 a. 把前端的公共库合并 b. 不同页面单独合并 c. 对于图片，使用雪碧图，base64编码图片，使用字体图标 d. 减少重定向 e. 使用缓存 f. 避免使用空的 href 和 src+ 2. 减小资源大小a. 对前端资源进行压缩b. 使用wep格式图片c. 开启gzip+ 3. 优化网络连接a. 使用CDN网络b. 并行连接 持久连接 管道化连接+ 4. 优化资源加载a. 资源加载位置，css引用在head中，先外链后本页，js引
2020-12-02 08:41:25
71
原创 js实现深拷贝
function copySingle(obj){ return JSON.parse(JSON.stringify(obj));}// 使用递归的方式function single(obj){ let nb = {} for(let i in obj){ if(obj[i] intanceof Object){ nb[i] = single(obj[i]); }else{ nb[i] = obj[i]
2020-12-02 08:37:03
59
原创 vue中使用element-ui 按需加载
项目中下载element-uinpm i element-ui -S配置[在src同级目录下建一个babel.config.js文件]代码如下module.exports = { presets: [ '@vue/cli-plugin-babel/preset' ], "plugins": [ [ "component", { "libraryName": "element-ui", "styleLibrary
2020-11-29 23:30:17
482
原创 解决vue项目中重复点击导航路由报错
vue版本“vue”: “^2.6.11”,主要代码//重复点击导航路由报错const originalPush = VueRouter.prototype.pushVueRouter.prototype.push = function push(location) {return originalPush.call(this, location).catch(err => err)}配置文件[router文件 下index.js]router > index.js
2020-11-29 23:11:55
621
3
原创 回流与重绘
回流与重绘浏览器加载Html生成Dom树，加载CSS生成CSSDom树，两者合并生成render树回流：在render树中计算每个节点的大小和位置重绘：根据回流得到的大小和位置在屏幕中重新绘制回流一定会引起重绘，但重绘却不一定会引起回流浏览器的优化机制浏览器会维护一个队列，队列中存放的是会触发回流和重绘的操作，当达到一定阀值或一定时间间隔时，才会清空队列。当获取元素的大小和位置时，为了保证准确，队列会被强制清空，因此，要注意这一类操作的使用。如何减少回流与重绘通过批量修改元素减少回流
2020-11-02 09:00:41
98
1
原创 new Object() 、 Object.create(）、{}，这三种方式创建对象有什么区别
new Object() 、 Object.create(）、{}，这三种方式创建对象有什么区别
2020-10-23 14:17:42
999
原创 http整理
什么是协议？信号的传输总要基于一定的规则，这个规则就是协议协议很多，http https ws DNS FTP SMTP什么是http协议http定义（超文本传输协议）http特点一定是浏览器主动向服务器发起请求一次请求都会对应一次响应服务器响应时间不一定是即时的，但它一定会响应http状态码 三个数字组成 第一个数字是响应的类别，分五种类别 1XX: 我已经收到你的消息了，我正在处理 2XX: 表示我们的请求已经被成功接收，接受 3XX: 重
2020-10-22 11:19:24
143
原创 前端面试高频问题
前端如何性能优化1. 减少请求数量 a. 把前端的公共库合并 b. 不同页面单独合并 c. 对于图片，使用雪碧图，base64编码图片，使用字体图标 d. 减少重定向 e. 使用缓存 f. 避免使用空的 href 和 src2. 减小资源大小 a. 对前端资源进行压缩 b. 使用wep格式图片 c. 开启gzip3. 优化网络连接 a. 使用CDN网络 b. 并行连接 持久连接 管道化连接
2020-10-20 18:53:44
143
原创 css设置文本溢出为省略号
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> div{ width: 600px; }
2020-10-16 10:09:52
96
原创 vue图片查看器v-viewer
下载npm i v-viewer -S引入main.jsimport Viewer from 'v-viewer'import 'viewerjs/dist/viewer.css'Vue.use(Viewer, { defaultOptions: { zIndex: 9999 }})使用<template> <div> <viewer :images="data"> <div v-for
2020-10-12 14:26:50
691
原创 vue+express实现文件的上传和下载
一、创建vue项目npm i axios -S<template> <div class="hello"> <!-- 标题 --> <h1>AirPort</h1> <!-- 选择文件 --> <div id="show" v-show="isShow"> <div class="show-top">您选择了如下文件<span @click="isShow
2020-10-09 19:36:13
1269
6
原创 vue跳转带参
vue跳转带参的两种方式一、query this.$router.push({path:'/detail',query:{detailList:res.data}} 二、params this.$router.push({name:'orderDetail',params:{shopID}
2020-09-23 19:15:45
91
原创 typescript创建vue项目
第一步【下载最新版本@vue/cli】npm i -g @vue/cliMicrosoft Windows [版本 10.0.18362.1082](c) 2019 Microsoft Corporation。保留所有权利。C:\Users\Lenovo\Desktop\1910-高级程序设计\项目>vue create ts-vueVue CLI v4.5.6? Please pick a preset: Manually select features? Check the f
2020-09-23 11:39:01
1468
原创 使用nrm
Microsoft Windows [版本 10.0.18362.1082](c) 2019 Microsoft Corporation。保留所有权利。C:\Users\Lenovo\Desktop\面试题\专高六>npm i nrm -gnpm WARN deprecated [email protected]: Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x. (Note that the
2020-09-21 09:35:43
207
原创 字节跳动面试题
async function async1() { console.log('async1 start'); await async2(); console.log('async1 end'); } async function async2() { console.log('async2'); } console.log('script start'); setTimeout(function() { ..
2020-09-16 08:47:55
365
原创 React的基础使用
React是一个js库原理React基于虚拟dom,通过js创建虚拟dom，虚拟dom转换真实dom并挂载到页面创建虚拟dom : react.createElement => jsx => 遇到 < > 解析成虚拟dom ; 遇到 { } 解析成js虚拟dom转换真实dom并挂载到页面 reactDom.render()搭建React项目1.安装脚手架npm i create-react-app -g2.创建一个react项目create-react-a
2020-09-15 19:46:18
126
原创 vue获取真实dom节点
ref && refs获取真实dom节点1.命名 2.获取 this.$refs.iptSon 组件<template> <div id="son"> <h1>{{title}}</h1> <p>我的名字叫{{name}}</p> <input type="text" ref="inp"/> <button @clic
2020-09-15 16:06:49
1473
原创 vue组件通信
1.vue组件关系父子关系子父关系并列（兄弟）关系多级嵌套（祖孙）关系2.vue组件通信父子传值父组件直接给儿子写对应属性及值 // 儿子接受并使用该变量props:{ name:{ type:String, required:false, default(){ return '小明' } }}子父传值委婉，通过调用父组件传递的函数方法，把想传的值写到函数参数中
2020-09-15 16:04:02
52
原创 脚手架构建vue项目
构建vue项目cmd打开小黑窗不知道是否安装，可以先【-大v】查看@vue/cli ，我用的是4.4.1版本的@vue/cli -V全局下载@vue/clinpm install -g @vue/cli进入你想构建项目的文件夹【可以输入dir查看文件目录】cd 项目/vue create 项目名，创建项目vue create health-up...
2020-09-15 15:39:22
365
原创 React封装路由表
第一步：在router文件夹下第二步：router.view.js 与 router.config.jsrouter.view.jsimport React from 'react'import {Switch,Redirect,Route} from 'react-router-dom'export default props =>( <Switch> { props.routers.map((item,key)=>
2020-09-13 21:29:23
1450
原创 跨域以及解决方法
跨域1.什么情况下会跨域1.协议不同2.域名不同3.端口号不同2.怎么解决跨域1.jsonp2.反向代理 （vue，react通过设置proxy）3.开启跨域资源共享vue设置反向代理@vue/cli 新增一个vue.config.jsvue-cli 找到config/index.js proxyTable: { '/':{ target:'http://localhost:7001' } }...
2020-09-13 21:16:56
58
原创 axios 使用：axios的封装（vue/react皆可用）
axios 使用1.安装 npm i axios -S2.引入 import axios from ‘axios’3.请求 axios.get('接口地址').then(data=>console.log(data)) axios.post('接口地址',{user:'欧阳栓柱',pwd:'123456'}).then(data=>console.log(data))
2020-09-13 20:58:23
134
原创 vue生命周期
vue生命周期生命周期是分阶段的1.实例期（组件在被初始化（第一次加载）的时候，我们通常程这个过程为组件的实例期）2.存在期（组件在被加载完成到它被销毁之前）3.销亡期（组件被销毁至销毁完成）生命周期函数 (会自动执行，但需要满足一定条件才触发)1.组件实例期会触发的生命周期函数组件被创建之前beforeCreate组件被创建组件被创建之后created组件被挂载之前beforeMount组件被挂载组件被挂载之后 mounted2.组件存在期（函数执行需要满足当前组件内
2020-09-13 20:54:33
180
原创 LeetCode ：1. 两数之和（JavaScript）
/* * @lc app=leetcode.cn id=1 lang=javascript * * [1] 两数之和 */// @lc code=start/** * @param {number[]} nums * @param {number} target * @return {number[]} */ //1.两数之和 var twoSum = function(nums, target) { let arr = nums
2020-09-13 20:39:23
87
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人