- 博客(90)
- 收藏
- 关注
RSS订阅原创 vue3学习之路-项目启动自动打开浏览器以及server配置
该文章主要包括以下几个内容1、vue3+vite项目配置项目启动默认打开浏览器的方法2、vite.config.js中关于server的相关配置说明3、配置server报错的解决方法4、vue2项目中配置项目启动默认打开浏览器的方法
2023-03-26 17:25:13
624
1
原创 React项目运行默认打开Chrome浏览器和取消打开浏览器
1、React项目运行默认打开Chrome浏览器2、React项目运行取消打开浏览器
2023-02-12 22:20:32
484
原创 webpack.config.js哪里找？react项目关闭eslint监测
webpack.config.js哪里找？react项目关闭eslint监测
2023-02-12 17:09:09
1311
1
原创 前端小知识点记录
记录一些零碎的知识点：该文章包含以下内容：整个网站网页变灰的方法vh和vw尺寸单位获取环境变量获取某个范围的随机数Circle阅读助手
2022-11-14 23:41:37
111
原创 选择器汇总
选择器汇总有通用选择器，标签选择器，id选择器，类选择器，属性属性器，伪类选择器，伪元素选择器，后代选择器，相邻后代选择器，兄弟选择器，相邻兄弟选择器等。文中还介绍了选择器的权重与原则。
2022-10-28 23:50:59
140
1
原创 Javascript中Date相关的知识总结
本文介绍了Javascript中Date的相关知识，主要内容包括以下几点：1、有方法说明，易混淆知识点2、介绍了时间转换3、标准时间和北京时间的转换等
2022-09-07 23:42:59
1042
原创 React中组件之间通信（父子组件、跨级组件、无关组件）
React中组件之间通信，包括父子组件、跨级组件、非父子非跨级的无关组件。通信方式有props、context、EventEmitter
2022-08-07 23:54:59
649
原创 React和Vue的props验证
本文主要讲解React和vue中的数据校验，主要包括以下内容：一、React中数据校验React中基本类型校验，默认值设置，必须属性设置React中组合数据类型校验：oneOfType,arrayOf,objectOf,shape等的使用二、Vue中的数据校验vue中的基本类型校验，默认值设置，必须属性设置vue中多种类型校验vue只对象数组校验vue中自定义类型校验...
2022-07-28 23:58:42
279
原创 有趣的Javascript题：a为什么时会打印结果
问题：当a等于什么的时候，if条件成立，并打印？初看这道题时一脸懵，a的值居然会随着判断条件不断累加，于是，大脑飞速运转，什么样的数据会随着操作而不断变化呢？思来想去也想不到这样的数据，所以只能利用巧妙方法了。 解答：方法一：利用对象的类型转换解释：a == 1 && a == 2 && a == 3是一个短路逻辑与运算符，表示左边条件成立时才会继续向右判断，否则整个条件都为假。所以a的第一个值必须为1才能继续向右判断 ，由此可知a的值或者说是类型转换后的值是可以自增长的，Javascript中
2022-06-23 23:08:25
275
原创 vue中缓存组件keep-alive
keep-alive相关介绍、keep-alive的使用、include和exclude的说明和使用，keep-alive相关的生命周期
2022-06-23 00:16:02
2476
2
原创 Vue动态设置img的src不生效的问题
在vue项目中动态设置img的src时，图片会加载失败。我们可以先看个例子。由结果可以看出图片加载失败。查看elements之后会发现，src被当做静态资源处理了，并没有进行编译。 为了解决动态的src没有进行编译的问题，我们可以使用require引入图片。 可以看到使用require引入图片之后，图片就可以正常加载出来了。require是在运行时加载，而import是编译时加载；如果希望使用import引入图片就需要提前导入图片。 另外require和import另外的区别：requir
2022-06-21 22:02:48
2757
原创 VUE中data相关的知识点
vue中data的几个知识点：data的重置，组件中的data是函数不能是对象的分析，vue实例中的data可以是对象也可以是函数
2022-06-07 23:19:16
1349
原创 浏览器中Javascript执行机制学习笔记一
变量提升要理解变量提升，我们先从一小段代码入手： showName() console.log(myname) var myname = '测试' function showName() { console.log('函数showName被执行'); }上面的代码执行之后会是什么结果呢？按照正常的逻辑分析，当执行到第 1 行的时候，由于函数 showName 还没有定义，所以执行应该会报
2022-05-14 22:35:29
189
原创 chrome调试工具使用技巧汇总
命令菜单打开命名菜单的快捷键：ctrl+shift+p切换主题输入switch to dark theme,就可以切换成黑色主题；输入switch to light theme就可以切换到白色主题等。截屏Capture area screenshot：对鼠标拖动区域的截屏Capture full size screenshot：对整个屏幕的截屏Capture node screenshot：对node节点的截屏改变调试窗口的位置Dock to bot.
2022-05-07 23:42:34
808
原创 浏览器原理学习笔记1-浏览器进程
基础知识：进程和线程进程：进程是一个具有一定独立功能的程序在一个数据集上的一次动态执行的过程，是操作系统进行资源分配和调度的一个独立单位，是应用程序运行的载体，也就是说进程是一个程序的运行实例。程序启动的时候，操作系统会为该程序创建一块内存，用来存放代码、运行中的数据和一个执行任务的主线程，这样的一个运行环境，就叫做一个进程。线程：线程是程序执行中一个单一的顺序控制流程，是程序执行流的最小单元，是处理器调度和分派的基本单位。线程和进程之间的关系：一个进程可以有一个或多
2022-04-21 23:22:39
887
原创 Chrome浏览器在开发者工具中如何设置User Agent
在DeVTools界面中点击右侧三个小点 ，在弹出的对话框中选择More tools，接着点击Network conditions选项，操作如下图所示：点击Network conditions选项之后，会出现Network conditions相关界面，找到User agent，取消勾选默认选项：点击Custom...的下拉箭头，选择自己需要的选项之后，刷新界面，界面就会...
2022-04-14 22:34:20
5666
原创 粘性定位 position: sticky
经常使用的定位方式是position: relative;position: absolute;position: fixed;很少有用到position: sticky，遇到一个需求是随着页面的滚动，当滚动某个标题位置时，该标题要固定到页面顶部。想到了监听界面滚动等方法实现起来比较复杂，最后才想到粘性定位。感受到粘性定位的强大之后决定记录下来。粘性定位就是当页面滚动到某个元素设置的条件时，该元素就会固定在某个位置不在随页面继续滚动，一直到条件不满足时再继续跟随页面滚动。使用方法：为元素添加p...
2022-04-07 23:51:48
2014
原创 React之JSX学习笔记
关于JSX的3个“大问题”1、JSX的本质是什么，它和JS之间到底是什么样的关系？JSX是模板语法的一种JSX作为react框架的一大特色，它与react本身的运作机制之间存在着千丝万缕 的联系。JSX是如何在Javascript中生效的？JSX会被编译位React.createElement()，React.createElement()将返回一个叫做“React Element”的JS对象。编译是由babel来完成的。babel是一个工具链，主要用于将ECMAScript20
2022-03-31 23:49:41
1116
原创 React中Fragment的使用
React中布局代码中return只能返回有一个元素，如果返回多个并列元素时就会报错：解决办法就是在并列元素外层包裹一层父元素，如下所示：export default class Demo extends React.Component { constructor(props) { super(props) this.dataList = [ { name: 'Javascript', desc: 'Javascript...
2022-03-28 23:52:02
1266
原创 双向绑定和v-model
v-model的简介v-model是一个指令，限制在<input>、<select>、<textarea>、components中使用，实现数据-视图、视图-数据的双向绑定。v-model的使用以及实例体现v-model的双向绑定<template> <div class="hello"> <input v-model="inputData" /> <p>输入的内容为：{{ inputDat
2022-03-21 23:01:31
797
原创 安装vue-devTool
因为chrome浏览器受限，不能在线安装devTools插件，只能离线安装。离线安装的方法有如下几种：下载devTools源码devtools下载地址：https://github.com/vuejs/devtools下载之后通过cmd命令进入到文件夹，1、首先输入安装依赖；输入npm install命令2、接着编译输入npm run build命令3、如果第二步成功之后，修改manifest.json文件找到manifest.json文件（shells ->
2022-03-20 22:39:50
1566
原创 input事件和change事件的区别
今天在监听<input>输入框的内容变化时监听的是change事件，本意是希望输入框内容一发生变化就执行事件监听方法，但是在运行时却发现我在输入框中输入了内容，但是监听事件并没有执行，改用input事件之后才达到了预期。于是，就查看资料了解了change事件和input事件的区别。input事件和change事件的区别input事件：输输入框内容发生改变时就会触发change事件：输入框内容发生改变，并且输入框失去焦点时触发。例如向输入框中输入一长串的内容后按下enter键、点击其他
2022-03-19 23:34:47
6281
原创 Tabbed Postman下载地址
Tabbed Postman下载地址：https://github.com/oznu/postman-chrome-extension-legacy
2022-03-18 22:38:48
375
原创 创建vue项目
一、检查是否安装nodejs在cmd命令窗口输入命令检查node和npm二、安装淘宝镜像输入npm install -g cnpm --registry=https://registry.npm.taobao.org确认淘宝镜像安装成功三、安装vue在命令行窗口执行cnpm install vue命令四、安装vue-cli在命令行窗口中执行cnpm install -g vue-cli命令五、创建项目执行 vue init webpack 自己的项目...
2022-03-17 22:41:27
217
原创 Javascript中this指向问题
普通函数时，this指向window <script> function test() { console.log('=== test this: ', this) } test() const test1 = function () { console.log('===test1 this: ', this) } test1() &
2022-03-14 22:38:06
1356
原创 系统环境变量配置失败
系统环境变量配置失败安装一些软件时，需要自己去配置环境。这周上班时发现之前配置的环境变量不起作用，查看才发现那条环境变量被清除了。重新配置之后重启电脑，环境变量依然会被自动清除。最后查找资料才发现，电脑的系统环境变量被限制在1024个字符，如果超出1024就会被截断。ps：有些系统超出长度时，没有提示，重启电脑运行时环境变量会自动被截断；而有的系统的环境变量对字符的限制是2047，超出长度时会有弹框提示，如下图所示：系统环境变量配置失败的解决方式删除不用的环境变量首先当然是删除不用的
2022-03-13 22:43:57
940
原创 click、touch，mouse事件的优先级
问题：一个DOM元素同时绑定click、touch、mouse(以mousedown为例)事件时，事件的优先级是怎样的？首先需要注意的是，pc端没有touch事件，所以在pc端不会响应touchstart、touchmove、touchend事件。在移动端，可以响应touchstart、touchmove、touchend事件。pc端的事件优先级mousedown事件→click事件移动的事件优先级点击touchstart→touchend→click按住之后不松开.
2022-03-07 23:41:37
636
原创 v-show和v-if
v-show和v-if的区别v-show和v-if都是vue中进行条件渲染的指令。1、v-show和v-if控制元素显示与隐藏的方式不同v-show是通过控制dom元素的display属性来控制元素的显示与隐藏；而v-if是直接在dom树中添加或者删除元素来控制元素的显示与隐藏。元素处于显示状态：元素处于隐藏不可见状态：可以看到当元素处于可见状态时，元素的属性并没有什么区别，但是当设置v-show和v-if为false时，就可以看出明显的差别——v-show控制的元素多了..
2022-03-07 23:07:32
1269
原创 Symbol
Symbol的定义方式1、Symbol()的方式使用Symbol定义的Symbol类型的变量，都不相等letsymbol1=Symbol()letsymbol12=Symbol()console.log(symbol1==symbol12)打印结果未false。可见symbol1和symbol2不相同letsymbol3=Symbol()symbol3.name='Javascript'console....
2022-02-28 22:47:07
139
原创 React新建项目
之前创建React项目时，特地将创建过程记录在了word文档上，但是重新找的时候，容易忘记路径，所以特地将该文档搬到csdn上。1、创建一个文件夹，并进入文件夹2、在文件夹路劲上输入cmd,按enter键进入当前文件夹下的命令行窗口3、在命令行窗口输入如下命令，按照淘宝镜像npm install -g cnpm --registry=https://registry.npm.taobao.org国内使用 npm 速度很慢，可以使用淘宝定制的 cnpm (gzip 压缩支持) 命令行工具代替
2022-02-27 16:43:02
604
原创 React-redux全局状态管理
这篇博客是看一个网上视频的笔记，后面也会根据自己在项目开发过程中遇到的问题进行不断的更新。Redux概述什么是ReduxRedux是一个用于Javascript状态容器，可以进行全局状态管理。Redux可以构建一致化的应用，运行与不同的环境（客户端，服务器，原生应用），并且易于测试。Redux除了和React一起使用外，还支持其他界面库，而且它体积很小（2KB）。Redux的设计初衷随着Javascript单页面开发日益复杂，Javascript需要管理更多的state(状态)，
2022-02-24 22:42:08
1883
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人