weixin_43852569的博客

原创 Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath ‘./lib/tokenize‘ is not defined by “exports“

react项目运行时报错

原创 git使用 -- 不对当前分支造成影响同时拉取远程分支

git使用 -- 不对当前分支造成影响同时拉取远程分支

原创 使用vite创建项目运行时Network提示‘use `--host` to expose’

使用vite创建项目运行时Network提示 “use --host to expose”最近在使用vite创建项目，使用npm跑起来后发现，Network没有显示具体的地址，在Network那个地方会显示如下图所示的这句话：这样的话，即使在同一个局域网内，其他人也无法访问到我这个页面，这个还是比较麻烦的；后来我通过查阅资料发现，原来Network不显示地址是因为IP没有做配置，所以不能从IP启动，这样的话也就没有办法通过IP访问我的页面。解决方法：咱们看一下官网上给的配置信息：这样一看，咱

原创 vscode配置在react的jsx中补全html提示

vscode配置在react的jsx中补全html提示点击vscode的文件 —》首选项 —》设置，然后搜索 includeLanguages，在出现的页面点击添加项，然后添加图中所示即可。或者直接在setting.json文件中添加如下配置："emmet.includeLanguages": {"javascript": "javascriptreact"},...

原创 微信小程序＜scroll-view＞组件左右滑动没有效果的问题

微信小程序组件左右滑动没有效果的问题小程序组件 < scroll-view > 中分别有上下竖向滑动和左右横向滑动之分，在这次项目中刚好需要用到横向滑动，但在测试过程中发现横向滑动没有了效果（静止在那里没移动过），经调试发现：< scroll-view > 中的需要滑动的元素不可以用 float 浮动；< scroll-view > 中，包裹着需要滑动的元素的大盒子用 display:flex; 是没有作用的；< scroll-view > 中的需要

原创 npm全局安装的包文件所在的位置

npm全局安装的包文件所在的位置有时候我们需要通过npm来安装一些配置在全局环境下的包，但是具体下载安装在什么位置却没有任何提示，这时候我们可以通过 npm root -g 来进行查询，就可以知道全局配置的包下载的位置了。npm root -g各个系统默认存放的位置1.WindowsC:\Users\username\AppData\Roaming\npm\node_modules2.Mac/usr/local/lib/node_modules/sprites-cli3.Linux/

原创 微信小程序中class=“container”的bug

微信小程序中class=“container”的bug今天在开发微信小程序的时候，在不经意间发现了一个bug，那就是如果把父元素的 class 设置为 container 的话，那么弹性布局 display:flex 就不起作用了如果想使用弹性布局 display:flex 的话，只需要把类名换成其他的名字即可。...

原创 JavaScript获取浏览器可视区域的宽高

JavaScript获取浏览器可视区域的宽高在做项目的时候，我们常常需要对项目做一些优化，来提升页面响应的速度，比如进入可视区域后再发送请求获取数据或者是填充模板，这个时候就需要能够获取到浏览器的可视区域的宽高：// 获取浏览器可视区域宽高（兼容性比较好，不包括工具栏和滚动条）var browserWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;var bro

原创 用cnpm安装的依赖没有在package.json中找到的解决办法

用cnpm安装的依赖没有在package.json中找到的解决办法起因今天在写项目的时候使用cnpm安装的依赖，等到提示安装完成后，想去package.json文件中去看看安装的依赖，结果没有找到，但是在node_modules文件夹中确实是安装成功了，这就让人很摸不着头脑。解决方法只需要在命令的最后加上一个 -S（大写的S） ，这样安装完成的依赖就能在package.json中看到了。cnpm install xxx（依赖的名称） -S...

原创 Vue学习之---动态组件中的activated与deactivated钩子函数

Vue学习之—被忽视的activated与deactivated钩子函数在学习这两个钩子函数之前呢，怎么需要先了解下Vue内置的动态组件< component >以及与之相配套的< keep-alive > 组件：动态组件指的是动态切换组件的显示与隐藏；< component is = " " > 标签，内置组件，占位符，专门用来实现动态组件的渲染；is 属性指定要渲染出来的组件的名字，指定的值是组件的注册名称；is 属性指定的组件名称是什么，就会在<

原创 Vue学习之---computed计算属性中你不曾注意到的小细节

Vue学习之—computed计算属性1.当写computed属性的时候要注意所有的计算属性，都要定义在computed 属性中；计算属性在定义的时候，要定义成方法的形式，而且定义成方法的形式后，方法中一定要有返回值，因为使用计算属性最终要得到的就是返回的值；计算属性最终会变成当前的Vue实例对象的属性；2.computed属性的两种形式2.1函数形式的计算属性var vm = new Vue({ data: { a: 1 }, computed: { //

原创 Vue学习之---watch侦听器

Vue学习之—watch侦听器Vue中的watch属性是什么，作用呢？watch属性中存在着能侦听Vue数据的侦听器，而侦听器本质上是个函数，要侦听哪一个数据的变化，就把数据名当做方法名即可；侦听器函数会接收两个参数：第一个参数是数据改变后的新的值，第二个参数是数据改变前的旧的值；watch属性中侦听器的格式watch属性中的侦听器存在着两种格式：方法形式的侦听器export default { data(){ // 定义的一些变量 }, watch:{ // 将要侦听的

原创 Vue指令中v-show 与 v-if 区别

Vue指令中v-show 与 v-if 区别v-showv-show 只是在 display: none 和 display: block 之间切换。无论初始条件是什么都会被渲染出来，后面只需要切换 CSS 或是切换下判断条件，DOM 还是会一直保留着的。v-ifv-if的话就得说到 Vue 底层的编译了。当 v-if 的判断条件为 false 时，组件或DOM元素就不会被渲染，也就是说根本不会创建这个组件或DOM元素；直到条件为 true时，才会创建出来；当判断条件发生切换时会触发销毁/挂载

原创 npm安装时报错：源文本中存在无法识别的标记的解决方法

npm安装时报错：源文本中存在无法识别的标记的解决方法今天在使用npm安装依赖包的时候，npm报了一个错误：当时找了半天也没看出来哪里有错误，于是上网查阅资料，才明白可能是安装的node版本的原因，所以导致npm不识别 @ 符号。解决方法：只需要使用引号将要安装的依赖包名包起来就解决了：...

原创 常见的Http状态码及其含义

HTTP状态码及其含义在写前端的一些功能的时候，大家难免要向后端发送请求，来拿到一些数据，这个时候后端就会返回给咱们一个响应状态码，了解这些状态码可以帮助咱们更好的读懂服务器返回的数据状态，下面是我翻阅资料查询到的一些常见的信息状态码供大家参考：1XX：信息状态码100 Continue 继续一般在发送post请求时，已发送了http header之后服务端将返回此信息，表示确认，之后发送具体参数信息2XX：成功状态码200 OK正常返回信息201 Created请求成功并且服务器创建了新

原创 VueRouter中的路由守卫的触发顺序（图解）

最近在学习VueRouter的时候，发现自己总是搞不清楚路由守卫触发的顺序，于是便找到了这个图，希望能够帮助到大家：

原创 Element-ui中的分页(pagination)组件的current-page属性不同步更新视图的坑

Element-ui中的分页(pagination)组件的current-page属性不同步更新视图的坑

原创 Vue中style使用scoped深度访问（样式穿透）的几种方式

Vue中style使用scoped深度访问（样式穿透）的几种方式1. >>>如果Vue项目中style的 lang 是 css，那么：<style lang="css" scoped>.a >>> .b { // css 样式}</style>但是有时候 >>> 这种写法不会被 scss 或 less 预处理器识别。2. /deep/如果Vue项目中style的 lang 是 less，那么：<

原创 Syntax Error: SassError: expected selector报错的解决方案

Syntax Error: SassError: expected selector报错的解决方案今天在写Vue项目的时候，在写样式的时候突然遇到了这么一个报错：因为写样式的时候，我在 < style > 标签中写了scoped 属性，这样导致我写的样式不能够传递给子组件，所以我写了一个 /deep/ 想要使用样式穿透，让子组件匹配上这个样式，但是不行，报了图片中的这个错误；后来通过查资料发现，原来是我写的 /deep/ 出了问题；如果使用 less 对 css 做出预处理的话，使用

原创 Vue组件的生命周期以及生命周期函数图解

Vue组件的生命周期以及生命周期函数图解组件的生命周期组件的生命周期是指一个组件从创建–>运行–>销毁的整个阶段，生命周期强调的是一个时间段；生命周期函数生命周期函数（也可以叫做钩子函数）是由vue框架提供的内置函数，会伴随着组件的生命周期，自动按次序执行；生命周期函数强调的是一个时间点；...

原创 一些常见的npm报错的解决方法

一些常见的npm报错的解决方法1. npm WARN Local package.json exists, but node_modules missing, did you mean to install?解决方法：输入npm install 或 cnpm install 后，再次启动npm run dev 成功启动2. npm 报错 This is probably not a problem with npm. There is likely additional logging ou

原创 FormData对象的介绍与使用方法

FormData对象的介绍与使用方法一. FormData对象介绍二. 创建FormData的实例对象1. 使用构造函数创建一个空的实例对象2. 使用已有的表单来初始化一个实例对象三. 使用方法1. 获取值2. 添加数据3. 设置修改数据4. 判断是否存在该数据5. 删除数据一. FormData对象介绍FormData对象其实是在XMLHttpRequest 2级定义的，定义它的目的就是为序列化表单以及创建与表单格式相同的数据（当然是用于XHR传输）提供便利。二. 创建FormData的实例对象1

原创 Vue.use()的快速上手使用及应用场景

前言总结

原创 Element-UI分页组件如何设置成中文

Element-UI分页组件如何设置成中文前言今天我在写项目的时候，发现在使用Element-UI组件的分页组件显示的是英文，不是中文：但是我在官网上看到的却是中文显示的，而且我也想要分页组件显示成中文，于是我看了下官网的说明，知道了为什么不显示中文了。解决办法原本Element 组件内部默认使用中文，但是我在使用的时候多写了这样一行代码：咱们看看官网上怎么说的：就是因为多写了这么一行代码，所以导致分页组件显示的是英文，当把这行代码注释掉之后，组件就可以正常显示中文了：当然如果你之后

原创 vue中v-model指令与.sync修饰符的区别

vue中v-model指令与.sync修饰符的区别前言1、pandas是什么？二、使用步骤总结前言1、pandas是什么？二、使用步骤总结

原创 e.preventDefault()与return false的区别

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇文章正文内容，下面案例可供参考一、pandas是什么？示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。二、使用步骤1.引入库代码

原创 什么是跨域以及解决跨域问题的方法

什么是跨域以及解决跨域问题的方法前言1、什么是跨域？2、解决方法总结前言作为一个前端人员，除了完成各种秀的飞起的页面外，最常打交道的应该就是 通过浏览器向后端发送ajax请求，请求响应数据，并对数据做出相对应的处理了，但是只要是发请求那就逃不开会碰到请求跨域的问题了。1、什么是跨域？跨域：指的是浏览器不能执行其他网站的脚本。它是由 浏览器的同源策略 造成的，是浏览器对javascript施加的安全限制。例如：a页面想获取b页面资源，如果a、b页面的 协议、域名、端口 不同，所进行的访问行动都是跨域

原创 JavaScript中数组的一些常用的方法

JavaScript中数组的一些常用的方法前言数组的方法总结前言作为前端人员，和数据打交道那都是家常便饭了，经常会用到一些数组的方法来完成一些业务上的逻辑，虽然用基础的循环判断语句也能够写出相同的逻辑，但是熟练掌握这些方法后能大大提高咱们工作的效率，最主要的是还可以让自己的代码b格瞬间提升好几倍，岂不是一石二鸟数组的方法现在进入正题，下面总结一下数组当中常用的一些方法：concatconcat() 方法用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。const ar

原创 项目功能流程记录

原创 Element-ui中form组件的校验规则

文章目录前言一、pandas是什么？二、使用步骤总结前言一、pandas是什么？二、使用步骤总结

原创 数组与对象的相互转化及数组转树形结构数据

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar