yrfjygb的博客

原创 vue.config.js的配置

vue.config.js的配置。

原创 项目难点和优化

初始打包速度97s初始编译速度165s第二次编译速度76s。

原创 微信小程序如何使用天地图的逆地理编码api

微信小程序如何使用天地图的逆地理编码api

原创 uniapp 无限级树形结构面包屑、单选-多选、搜索、移除功能插件，基于【虚拟列表】高性能渲染海量数据，加入动态高度、缓冲区

uniapp无限级树形结构组件，支持多选，单选，搜索，无限级面包屑类型导航

原创 Vue Cli inspect

vue-cli-service inspect：可以使用 vue-cli-service inspect 来审查一个 Vue CLI 项目的 webpack config。2、输在在文件中：vue-cli-service inspect --> output.js。我一般是直接配置在 package.json 中的 scripts 中，1、输出在控制台：vue-cli-service inspect。输出文件比较多，这里截取了一部分。

原创 在元素内部滚动，滚动到距离底部100触发条件

【代码】在元素内部滚动，滚动到距离底部100触发条件。

原创 极简插件地址

极简插件地址vue-devtools。

原创 报错 Cannot read properties of undefined (reading ‘propsData‘)“ ？ 看我的就行，最新解决方法

报错 Cannot read properties of undefined (reading ‘propsData‘)“ ？

原创 webpack是如何解析模块的

webpack模块解析

原创 proxy前端跨域处理

我们发送的请求以/api开头的，会指向target写的地址（https://c.m.163.com）,changeOrign: true -> 允许跨域，rewrite -> 进行将/api换成’’ (去掉/api)因此，我们发送的请求的地址都是要以/api开头的才会代理（proxy）

原创 收藏的网站

前端各类知识网站

原创 jsx 的使用方法

添加链接描述

原创 动态组件名，如何在render函数中显示出来

展示特别注意的是，Tag一定要大写，否则会报组件未注册。Tag是动态组件名，动态组件名已是全局注册。<script>export default { name: 'BaseFiles', render(h) { const Tag = this.item.type return ( <Tag attr={this.item.attr} form={this.form}/> ) }, props: { ite

原创 js的知识

NaNNaN表示它不是一个数字，本来返回值是数值的操作却失败了，当我们用0/任何值的时候，会返回NaN类型，NaN不等于任何值，即使是它本身。ECMScript它还提供了一个isNaN函数，来判断它是否不是一个数字，参数可以是任何值，该函数会将参数会先进行转换成数值，如果可以转换成数值，返回false。不能则返回true。...

原创 vuetool 的下载

添加链接描述

原创 node的安装和配置

添加链接描述脚手架安装有点旧了

原创 面经总经题

1、判断变量类型的几种方法（还细问了其它的忘了）2、作用域和作用域链3、遍历对象的方法，区别4、箭头函数5、垃圾回收机制6、异步7、数组去重，set为什么不可重复原理8、和=9、var，let，const的区别10、跨域11、async和defer12、https13、用css画个三角形14、元素垂直居中15、vue-router的两种模式以及区别16、vue响应式原理...

原创 如何避免内存泄漏

如何避免内存泄漏添加链接描述

原创 重绘和回流

重绘改变了元素的外观，比如：改变了元素的颜色，但不会影响页面的布局，把改变后变化重新绘制在屏幕上，这个过程叫重绘回流（重排）改变了渲染树的节点，影响了该节点的几何属性，导致节点位置发生了变化，这个时候浏览器就要重新构建渲染树，这个过程就是回流（重排）比如：g给某个p标签添加了display为none的样式，p标签被隐藏了，p标签之后的位置就发生了变化，此时浏览器就需要重新构建渲染树。重新布局。重排一定导致重绘，重绘不一定导致重排影响重绘重排的原因有添加/删除dom元素元素的尺寸和位置发生了改

原创 浏览器原理与渲染流程

TCP连接，TCP三次握手第一次握手，客户端将发送一个带SYN标志的数据包给服务端，代表开始建立连接第二次握手，服务器返回一个带 SYN/ACK标志的数据包给客服端，表示服务器传达确认连接的信息，要求与客户端建立连接第三次握手，客户端就发送带ACK标志的数据包给服务端，表示客服端同意连接，连接成功，客服端和服务器就可以进行数据传输。TCP为什么是三次握手？答案解析一 防止重复连接若建立连接只需两次握手，客户端并没有太大的变化，仍然需要获得服务端的应答后才进入ESTABLISHED状态，而

原创 node使用第三方插件

bcrypt 密码加密使用地址项目中使用：utils/tool.jsconst bcrypt = require('bcrypt')const fs = require('fs')const path = require('path')const jwt = require('jsonwebtoken')exports.hash = (myPlaintextPassword) => { return new Promise((resolve, reject) => {

原创 Vue高频面试

一、 生命周期1.1 说一下生命周期1.2 页面（组件）一加载会执行哪些生命周期追问：执行这些生命周期的时候什么时候有节点和数据？ 节点：this.$el 数据：this.$data created以及created之后有节点 mounted以及mounted之后有数据beforeCreate 没有节点，没有数据created 没有节点，有数据beforeMount 没有节点，有数据mounted 有节点，有数据1.3 生命周期都怎么用？，你用哪些？我一般这样子用：

原创 uniapp

nvue

原创 mvc和mvvm

mvcmvvm数据在model中，通过vm在view中显示出来，view修改数据传递给vm，vm在传递给m例子：template ==> viewexport default ==> viewmodelexport default {data() {return {title: ‘Hello’}},onLoad() {},methods: {}}data ==> modeldata() {return {title: ‘Hello

原创 WebSocket

WebSocketWebSocket 是一种数据通信协议，也是用于客户端和服务端数据通信，类似于我们常见的 http既然有 http，为啥还要 WebSockethttp 通信是单向的请求 + 响应没有请求也就没有响应初次接触 WebSocket 的人，都会问同样的问题：我们已经有了 HTTP 协议，为什么还需要另一个协议？它能带来什么好处？答案很简单，因为 HTTP 协议有一个缺陷：通信只能由客户端发起。举例来说，我们想了解今天的天气，只能是客户端向服务器发出请求，服务器返回查询

原创 拿到上传后的图片

拿到上传后的图片代码：const blob = window.URL.createObjectURL(this.$refs.file.files[0])显示图片 <img :src="value" alt/>

原创 第一次面试的总结

1.面试题不足CSS布局axios拦截器，请求拦截器/响应拦截器、2.反问HR内容不足3.自我介绍不足问候学校+出生日+出生城市+兴趣爱好技能+性格模板：面试官，你好，我是来自广东技术师范大学天河学院计算机学院18软件一班的学生。出生于1997，出生于广东梅州市，平常喜欢打篮球，跑步等运动，基础扎实、掌握前端专业技术，个人做事殷勤，刻苦努力，热爱学习，对前端感兴趣，有团队合作精神。与人相处融洽。...

原创 http状态码

400 客户端请求参数错误401 用户未认证,token失效403 用户权限不够404 资源未找到

原创 配置sass全局变量Undefined variable: “$theme-color“.

原因：sass版本不同选项不同sass v8 版本使用 prependDatamodule.exports = { css: { loaderOptions: { sass: { prependData: `@import "assets/css/_variable.scss";` } } }, configureWebpack: {

原创 各种的布局

上面固定，下面固定，中间高度如何确认？方法1：使用calc()calc(100%-上面的高度-下面的高度)方法2：使用定位，子绝父相.child{position:absolute;top:上面的高度;left:0;right:0;bottom:下面的高度;}...

原创 EventEmitter has used unknown event type: “pullingUp“, should be oneof

错误：原因：上拉加载功能是一个插件。因为上拉加载是一个插件，而script标签引入的js就要包括所有插件。解决：1.判断srcipt标签引入的js是否包含所有插件如果引入了这个，代表没有任何插件，无法实现上拉加载<script src="https://unpkg.com/@better-scroll/core@latest/dist/core.js"></script>换成下列引入，包括所有的插件 <script src="https://unpk

原创 Better-scroll

滚动原理：.content是一个元素，不能是多个元素组成.wrapper高度要小于.content安装和使用vue中安装： npm install better-scroll --save使用：导入 import BScroll from 'better-scroll'创建 new BScroll(this.$refs.wrapper, {})创建html元素 .wrapper和.content.wrapper高度要小于.content.wrapper{ backgrou

原创 axios的封装

安装使用安装：npm install axios --save使用：import axios from 'axios'1.回调函数封装// 回调函数的形式export function request1(config){ // 1.创建axios的实例 const instance = axios.create({ baseURL:'https://123.207.32.32:8000', timeout:5000 }) // 发送真正的网络请求

原创 vue 知识点

1. 导入组件.vue1.1 导入组件import TabBer from 'components/common/Tabber/Tabber.vue'1.2 加载到父组件上export default { name: 'App', components: { TabBer }}1.3 使用导入的组件<template> <div id="app"> <tab-ber></tab-ber> </div&

原创 Git 操作知识

1.如何将初始项目提交到远程仓库git remote add origin https://github.com/snakehyq/supermall.git git push -u origin master

原创 前端面试提二

1. 前端性能优化措施有哪些呢？前端性能优化主要是为了提高页面的加载速度，优化用户的访问体验。我认为可以从这些 方面来进行优化。第一个方面是页面的内容方面（1）通过文件合并、css 雪碧图、使用 base64 等方式来减少 HTTP 请求数，避免过多的 请求造成等待的情况。（2）通过 DNS 缓存等机制来减少 DNS 的查询次数。（3）通过设置缓存策略，对常用不变的资源进行缓存。（4）使用延迟加载的方式，来减少页面首屏加载时需要请求的资源。延迟加载的资源当用 户需要访问时，再去请求加载。（5

原创 常见的面试题

原创 vue案例-计数器

代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <script src="http

原创 Vue初体验

代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <script src="http

原创 Node-path模块

官网 node中的path模块1.获取包含后缀名的文件名// 导入path模块const path = require('path')// 1.获取包含后缀名的文件名const basename = path.basename('C:/list/win-i386/obsolete/index.html')console.log(basename);// 获取不包含后缀名的文件名const basename1 = path.basename('C:/list/win-i386/obsolete