青柠i - 博客园

2021年11月6日

摘要：前提：路由使用 BrowserRouter 模式在 index.html 中引入了样式 1. 修改路径1 public/index.html 中引入样式时不写./写 /（常用) 2. 修改路径2 在 React 中 public/index.html 中引入样式时不写 / 写 %PUBLIC_U 阅读全文

posted @ 2021-11-06 17:04 青柠i 阅读(230) 评论(0) 推荐(0) 编辑

Error: A <Route> is only ever to be used as the child of <Routes> element, never rendereddirectly.Please wrap your <Route> in a <Routes>.

摘要：原因： React路由版本问题，你可以查看自己的package.json文件，查看react-router-dom的版本，应该是 6 版本。在 React-Router v6版本中，Route更改了使用方式。使用 Route 需要在 Routes 标签包裹下： import { BrowserR 阅读全文

posted @ 2021-11-06 15:08 青柠i 阅读(1896) 评论(0) 推荐(0) 编辑

关于Chrome最新版，控制台变成中文以及打开控制台变慢了的解决办法

摘要：相信大家最近发现F12打开控制台的时候，发现有个东西一直在控制台上面，如下图： 1. 当你点击了第一项后，控制台变成中文可能有许多小伙伴觉得它很烦，然后点击了第一项Always match Chrome's language，然后控制台就变成中文的了，如下图： 1.1 方法1：这时候我们可以点击阅读全文

posted @ 2021-11-06 10:34 青柠i 阅读(691) 评论(0) 推荐(0) 编辑

2021年11月5日

React中处理跨域问题

摘要： 1. 跨域跨域问题是前台浏览器造成的，同源策略。两个 URL 的“协议/主机（域名）/端口元组”一致，即同源。 React App在本机 3000 端口上运行 2. 解决办法： 1. cors : 后台服务器端解决 //以Node服务器举例 const express = require("exp 阅读全文

posted @ 2021-11-05 16:41 青柠i 阅读(859) 评论(0) 推荐(0) 编辑

2021年10月31日

Vue中自定义Toast插件

摘要： Toast组件用于展示提示信息，属于项目全局都可以使用。 1. Toast.vue <template> <div class="toast" v-show="isShow"> {{ message }} </div> </template> <script> export default { na 阅读全文

posted @ 2021-10-31 16:58 青柠i 阅读(197) 评论(0) 推荐(0) 编辑

2021年10月28日

Vue 的响应式原理

摘要： 1. 前言当data中的数据发生改变，Vue内部是如何监听message数据的改变？使用Object.defineProperty > 监听对象属性的改变当数据发生改变，Vue是如何知道要通知哪些人？哪些页面进行更新？使用发布订阅者模式实现 2. 过程 2.1 首先new Vue() n 阅读全文

posted @ 2021-10-28 14:58 青柠i 阅读(38) 评论(0) 推荐(0) 编辑

Nginx 项目部署

摘要： 1. Window 本地部署 1.1 下载安装官方地址https://nginx.org/ 其中包含很多nginx版本，大致可以分为： Mainline version ： Mainline是 Nginx目前主力在做的版本，可以说是开发版 Stable version：最新稳定版，生产环境上建议使阅读全文

posted @ 2021-10-28 12:57 青柠i 阅读(293) 评论(0) 推荐(0) 编辑

2021年10月23日

如何删除 Vue 创建项目的预设模板

摘要： 1. 找到C盘下的路径 Windows操作系统下： C:\Users\admin\.vuerc 2. 打开.vuerc文件 3. 修改完成阅读全文

posted @ 2021-10-23 10:12 青柠i 阅读(536) 评论(0) 推荐(0) 编辑

2021年10月13日

Git 学习笔记

摘要： Git是分布式服务器自报家门：你的名字和Email地址 # 安装完，使用Git前需自报家门 git config --global user.name "Your Name" git config --global user.email "email@example.com" 1. 创建仓库(创阅读全文

posted @ 2021-10-13 20:28 青柠i 阅读(33) 评论(0) 推荐(0) 编辑

认识 Flex 布局

摘要： 1. 什么是flex布局? Flex 是 Flexible Box 的缩写，意为" 弹性布局 "( 弹性盒模型 )，用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为 Flex 布局。 .box{ display: flex; } .box1{ display: inline-flex; } 阅读全文

posted @ 2021-10-13 12:21 青柠i 阅读(42) 评论(0) 推荐(0) 编辑

青柠

公告