![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前后端
hellopari
这个作者很懒,什么都没留下…
展开
-
如何在json文件夹中使用正则表达式
参考文档:https://stackoverflow.com/questions/25426464/regex-pattern-in-json。方法:将转译符号写两次,如下图所示。如果直接像在js中写的话会报错。原创 2023-02-18 13:31:17 · 350 阅读 · 0 评论 -
react hook
自定义 Hook,可以将组件逻辑提取到可重用的函数中。每次使用自定义 Hook 时,其中的所有state和副作用都是完全隔离的。自定义 Hook 是一个函数,其名称以 “use” 开头(否则React将无法自动检查你的Hook是否违反了Hook的规则),函数内部可以调用其他的Hook。原创 2022-09-08 10:40:24 · 234 阅读 · 0 评论 -
关于js默认值
false,undefined,null,NaN,0,“” or ‘’ or `` (empty string)的时候,将不会使用默认值。变量可以先赋予默认值。当要提取的对象对应属性解析为 undefined,变量就被赋予默认值。函数默认参数允许在没有值或undefined被传入时使用默认形参。:使用“||”!原创 2022-09-01 18:16:03 · 4758 阅读 · 0 评论 -
React.createRef/将指定元素滑动到可视区域scrollIntoView()
当组件挂载的时候,React将把DOM元素赋值给current属性,当组件卸载的时候ref为null,ref 在componentDidMount和componentDidUpdate两个生命周期方法执行时发生更新。以及在React elements 上添加ref 属性创建,在构建组件时,ref通常被赋值给instance属性,以便在整个组件中引用它们。当ref在render方法中传递给了一个element后,这个节点的引用在ref的current属性上可访问了。...原创 2022-08-21 14:30:51 · 840 阅读 · 0 评论 -
判断元素出现在可视区域的方法
它会注册一个回调函数,每当被监视的元素进入或者退出另外一个元素时(或者viewport),或者两个元素的相交部分大小发生变化时,该回调方法会被触发执行。这样,我们网站的主线程不需要再为了监听元素相交而辛苦劳作,浏览器会自行优化元素相交管理。当以下情况发生时该回调方法会被调用。请留意,你注册的回调函数将会在主线程中被执行。所以该函数执行速度要尽可能的快。缺点事件监听和调用都是在主线程上运行,因此频繁触发、调用可能会造成性能问题。返回一个DOMRect对象,其提供了元素的大小及其相对于视口的位置。.......原创 2022-08-01 15:06:28 · 743 阅读 · 0 评论 -
the difference between inline-flex and inline-block in CSS
The main difference between display: flex and display: inline-flex is that display: inline-flex will make the flex container an inline element while its content maintains its flexbox properties.There is only one main difference between the inline-block an翻译 2022-07-10 20:31:16 · 106 阅读 · 0 评论 -
关于css展示图片的一部分花了两个钟这个问题
记录一下自己的低效笨拙的代码经历:利用css展示五角星的一部分like this : 就这个样式,几行代码而已,由于之前写过一遍,但是没有保存,所以第二次写的时候没有想着怎么样实现功能,只是一个劲的去回忆昨天怎么实现的,然而根据回忆却一直无法复现,开始焦虑和不可思议。然后又反复尝试,告诉自己重新思考这个问题,甚至参考已有的代码,但仍然无法实现,我仿佛陷入了一个诅咒中,怎么都逃不出来,于是我开始怀疑自己的智商,就这个简单的问题竟然卡了两三个小时,最后新建一个index.html在最原始的文档里尝试,很快原创 2022-07-10 16:42:19 · 350 阅读 · 0 评论 -
git报错
git报错集合整理原创 2022-07-04 20:01:46 · 166 阅读 · 0 评论 -
条件渲染之react高阶组件——HOC
定义:它接受任何输入(多数时候是一个组件)并返回一个组件作为输出。返回的组件是输入组件的增强版本,并且可以在 JSX 中使用。创建一个简单的 HOC,它将一个组件作为输入并返回一个组件。es6的写法使用场景:条件渲染............原创 2022-07-02 12:02:55 · 585 阅读 · 0 评论 -
PX, EM, REM, %, VW, 和VH的区别
绝对单位相对单位EM: 相对于父元素REM: 相对于根元素 (HTML tag)%: 相对于父元素VW: 相对于视口的宽度VH: 相对于视口的高度与px不同的是,%, EM, REM 更适合用在自适应的情况. 相对单位在不同的设备上可以更好的缩放,因为他们可以根据其他元素的尺寸缩放。由于em是相对父级元素,因此对于嵌套的元素,有时候最终的尺寸会意想不到PX, EM, and REM 主用用于字体尺寸,而 %, VW, and VH 大多数情况用在margins, padding, spacing, an原创 2022-06-13 13:57:26 · 194 阅读 · 0 评论 -
js中的函数参数的引用传值
function changeStuff(a, b, c){ a = a * 10; b.item = "changed"; c = {item: "changed"};}var num = 10;var obj1 = {item: "unchanged"};var obj2 = {item: "unchanged"};changeStuff(num, obj1, obj2);console.log(num);console.log(obj1.item);console.原创 2021-08-25 10:25:39 · 267 阅读 · 0 评论 -
组合式 API如何解决vue2中mixin的局限性?
Mixin 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。// 定义一个mixin objectconst myMixin = { created() { this.hello() }, methods: { hello() { console.log('hello from mixin!') } }}// 定义一个app使用这个 mixinconst app = Vue.createApp({ mixins: [myMix原创 2021-08-23 23:54:35 · 453 阅读 · 0 评论 -
webpack构建加速
分析打包速度speed-measure-webpack-plugin插件测量你的 webpack 构建期间各个阶段花费的时间分析影响打包速度环节搜索时间搜索所有的依赖项解析时间webpack根据我们配置的loader 解析相应的文件,由于 js 单线程的特性使得这些转换操作不能并发处理文件,而是需要一个个文件进行处理压缩时间将所有解析完成的代码,打包到一个文件中,为了使浏览器加载的包更小(减小白屏时间),所以webpack 会对代码进行优化。JS 压缩是发布编译的最后阶段,通常 webpac原创 2021-08-15 20:05:20 · 164 阅读 · 0 评论 -
避坑:vite Component provided template option but runtime compilation is not supported in this...
This worked for me in vite.config.tsexport default defineConfig({ define: { ‘process.env’: {} }, plugins: [vue()], resolve: { alias: { ‘vue’: ‘vue/dist/vue.esm-bundler.js’ } } })原创 2021-08-11 15:03:15 · 2096 阅读 · 1 评论 -
服务器端渲染 (SSR)
什么是服务器端渲染 (SSR)?客户端渲染:使用 JavaScript 框架进行页面渲染服务端渲染:服务端将HTML文本组装好,并返回给浏览器,这个HTML文本被浏览器解析之后,不需要经过 JavaScript 脚本的执行,即可直接构建出希望的 DOM 树并展示到页面中,最后将这些静态标记"激活"为客户端上完全可交互的应用程序。为什么使用服务器端渲染 (SSR)?优点:更好的 SEO,由于搜索引擎爬虫抓取工具可以直接查看完全渲染的页面。对客户端渲染的页面来说,简直无能为力,因为返回的HTML是一个原创 2021-08-09 09:38:10 · 8787 阅读 · 0 评论 -
webpack4说明
webpack4文章目录webpack4webpack 是什么?安装使用打包模块入口文件打包命令打包配置核心配置modeentryoutput深入执行简要流程Loadersraw-loaderfile-loaderurl-loadercss-loaderstyle-loadersass-loaderPluginsHtmlWebpackPluginclean-webpack-pluginmini-css-extract-pluginsourceMapWebpackDevServerProxyHot Modu原创 2021-07-08 15:35:48 · 207 阅读 · 0 评论 -
npm install报错,getting node-gyp rebuild错误
在升级vue3的时候,gyp一直报错我的解决办法:删除 HOME/.node−gyp目录如(/home/username/.node−gyp或者/Users/username/.node−gyp.),再试一次另外,很多工具不能很好的解决路径中包含空格的名字如(/Users/ernestson/).如果还不行,可以删除HOME/.node-gyp 目录如(/home/username/.node-gyp或者 /Users/username/.node-gyp.),再试一次另外,很多工具不能很好的解决路原创 2021-07-05 19:35:15 · 565 阅读 · 0 评论 -
git error: src refspec delete does not match any理解远程分支和存在于远程仓库中的分支之间的区别
git push origin delete newbranch报错:git error: src refspec delete does not match any少了加了两个杠!!git push origin --delete newbranch命令git branch -a显示本地仓库中存在的远程分支和本地分支。理解远程分支和存在于远程仓库中的分支之间的区别远程分支是映射到远程仓库分支的本地分支。因此,远程分支集表示远程仓库的状态。更新远程分支列表的常用方法是使用git fetch原创 2021-07-01 10:41:16 · 495 阅读 · 0 评论 -
import和require的区别
CommonJS、AMD、CMD :require/exportsES6(ES2015):import/exportCommonJS 作为 Node.js 的规范,Node.js 无法直接兼容 ES6Babel 转码器将还未被宿主环境(各浏览器、Node.js)直接支持的 ES6 Module 编译为 ES5 的 CommonJS —— 也就是 require/exports 这种写法目前你编写的 import/export 最终都是编译为 require/exports 来执行的。区别:1:.原创 2021-06-25 20:50:16 · 122 阅读 · 0 评论 -
如何在谷歌浏览器中安装 vue-devtools?
可直接看总结三种方法:https://juejin.cn/post/6844904126178918413谷歌应用商店下载(需翻墙)下载后vue显示vue.js not detected这事我卸载的查资料说是要在这个扩展的安装路径下找到 manifest.json 文件,把 “persistent”: false,改为:true。路径:C:\Users\mymsi\AppData\Local\Google\Chrome\User Data\Default\Extensions\nhdogjm原创 2021-06-12 22:08:52 · 224 阅读 · 3 评论 -
关于vuex module模块化分割时引入目录的问题
项目目录city/index.jsimport state from "./state";import mutations from "./mutations";import getters from "./getters";export default {namespaced: true, state, getters, mutations,};在store/index.js中引入city模块的index不可以写成import city from './city'原创 2021-04-28 16:12:10 · 143 阅读 · 0 评论 -
使用scss报错的问题
npm run dev的时候报错,主要是因为在style标签里使用了lang=‘scss’,但是没有下载相关依赖,报错的提示了,我们就按照它说的做就行了。输入以下命令,就成功了npm install --save vue-style-loader css-loader...原创 2021-04-28 10:00:33 · 1049 阅读 · 0 评论 -
vue笔记
VScode 中编辑 VUE文件无法自动补全标签https://segmentfault.com/a/1190000010339485原创 2021-03-31 16:13:21 · 56 阅读 · 0 评论 -
es6实现数组内两元素做差
const a=[0,1,2,3,4];const [,...b]=a;console.log(b)constr=b.map((v,i)=>v-a[i]);原创 2021-03-26 22:07:39 · 253 阅读 · 0 评论 -
完成一个webservice应用的大概过程
1:用到的java编辑工具是ideal2:在ideal上配置jdk,tomcat,maven,且maven一定要勾选,否则不会自动帮你下载相关依赖和jar包以上三个就需要配置好一会了,说不定遇到各种问题3:下载mysql数据库,下载navicat,mysql的图形管理界面让navicat连接mysql,建表4:打开项目,找到main文件运行,在浏览器中输入localhost加端口号查看...原创 2019-09-28 10:39:57 · 289 阅读 · 0 评论