张张张的博客

从代码库拉下来的代码，npm install 安装所有依赖的时候，报错如下图所示。再次执行npm install就可以了，项目就可以正常起来了。经过检查，淘宝镜像于2024年1月22号，证书过期了。

修改进度条的样式，在node_modules/nprogress/nprogress.css。2.引入nprogress和样式文件。3.在前置守卫添加进度条的展示。1.先安装nprogress。

需求是点击登录，还是显示在用户管理菜单下，正常下项目登录进去都是首页。3.在登录页点击登录判断路径是否有query参数。页面现在用户管理菜单下，点击退出登录。2.点击退出登录，携带query参数。1.获取当前菜单的路径。

2.使用document.fullscreenElement（）来判断是都全屏。

点击导航的刷新按钮，刷新下方主体内容，我这边的项目分为左-上-下结构，上边为tabbar组件，下边为main组件，点击刷新整个流程是刷新按钮，去访问它父组件tabbar的兄弟组件main，使main组件内容进行刷新。这就涉及到组件之间数据传递了。在main组件里判断仓库中的refsh是否发生变化，再搭配nextTick函数使用，就可以完成就可完成帅刷新的效果了。在这里我使用的是pinia。在setting.ts设置一个变量refsh，方便main和tabbar访问。点击刷新按钮，获取到仓库中的值进去取反。

在<style scoped lang="scss"></style>里添加自己想要的特效就可以。我这边mian/index.vue是配置二级路由出口。关于导航的过渡特效，vue官网有教程。

vue3+vite项目安装了vite-plugin-mock之后，根据官网配置使用，vscode会出现波浪线，启动项目，发现运行不了。安装vite-plugin-mock2.9.6的版本即可。

*所有的svg图标都必须放在assets/icons。2.在vite.config.ts中配置。下边我们封装一个svg组件。

项目中引入了element-plus国家化的配置，然后进行项目打包，报下面的错误。在main.ts中添加。

在开发过程中，避免不了前端和后端不在一个局域网下，这时候，前后端联调的时候，前端访问不到后端的服务器，使用穿透就可以解决这个问题。5、下载之后，解压到任意目录，看见natapp.exe。看到这个界面就成功了，访问红框中的地址就可以访问了。3、击购买渠道 （选择免费渠道即可）7、运行natapp.exe，4、选择自己电脑版本进行下载。2、进行注册，然后登录。6.我的渠道获取自己的。

1.父组件提供要传递的数据-state2.给子组件标签添加属性值为state中的数据3.子组件通过props接受父组件中传过来的数据a.类组件使用this.props获取props对象b.函数式组件直接通过参数获取props对象props说明：props是只读对象，不能进行修改props可以传递任意数据（数字，字符串，布尔值，数组，对象，函数，JSX）1.父组件提供一个回调函数，用于接受数据2.将函数作为属性的值，传给子组件3.子组件通过props调用 回调函数。

3.在请求拦截器拦截，做处理（这里记住加一个判断，有name的值话才会加在请求头里，避免影响其他接口）1.在封装接口传参时，定义形参，params是正常传参，name则是我想要在请求头传参。成功发起发起之后，可以在控制台查看一下，有下边的效果就加上了，注意：这里修改请求头的信息，会有跨域的问题，需要后端配置信息。

【代码】基于vscode配置setting.json格式化文档，适合vue,react。

如果出现这个问题是因为React目前推出最新的版本为18.0，在18.0版本中，React不再支持 ReactDOM.render，如果使用ReactDOM.render，控制台就会报错，但并不影响程序的正常运行。当你学习react路由遇到上面这个问题，先检查一下react-router-dom的版本，如果版本是6.0.0以上都会遇到这个问题。2.将<route></route>所有的标签放在<routes></routes>此时还会出现点击链接市无法跳转，将component改成element即可。

上面圈着的部分就是
，前端需要将数据进行换行，对于这类型的数据，在前端页面是需要进行稍微处理才能正常显示。如果没有经过处理，那么内容是不会在有换行符的位置进行换行显示的。pre-wrap:连续的空白符会被保留。在遇到换行符或者< br >元素，或者需要为了填充「行框盒子(line boxes)」时才会换行。pre-line连续的空白符会被合并。在遇到换行符或者< br >元素，或者需要为了填充「行框盒子(line boxes)」时会换行。使用v-html输出文本。以上两种方法都可以实现。

使用复制的方法，将healthcheck文件夹的内容放在public文件夹下边，安装依赖，配置vite.config.js配置即可。vite将项目打包之后，自动会生成一个dist文件，里边只有/assets,index.html,favicon.ico.这三个文件。现在需求是打包之后，dist文件夹下多怎加一个healthcheck的文件夹。在vite.config.js文件中导入。

src下边的index.html页面是入口文件。/modules文件夹是用来存放所有类的。本项目使用webpack+ts所编写。index.ts是引入所有的ts文件。下边是项目的文件目录。

element-plus按需引入，修改项目的主题色

点击复制按钮，实现文本的复制或者其他内容的复制

1.监视reactive定义的响应式数据时，oldValue无法正确获取，强制开启了深度监听（deep配置无效）注意：一般开发中使用情况三就可以，如果操作其中的某个属性，单独给她拎出来就可以。2.监视reactive定义的响应式数据中某个属性时，deep配置有效。