weixin_53777282的博客

原创 黑马react-Day02

</div>解决思路：自定义Hook//封装自定义Hook//解决：组件复用，状态共享//可复用的逻辑代码show) }//哪些状态和回调函数需要在其他组件中使用 returnreturn (<div>

原创 黑马react-Day01

三元：如果loading为true，则第一个span标签显示，如果为false，则第二个span标签显示。&&：如果flag为true，则span标签显示，如果为false，span不显示。运行项目：npm start。

原创 使用style JSX写页面css样式

实现按钮字体颜色切换。

原创 Link组件+as属性

Link 组件的 href 不但支持字符串，还可以传入 UrlObject，UrlObject 提供了一种更灵活的方式来定义路由，它允许你构建一个对象，该对象包含了路由路径和查询参数。as: 一个对象或字符串，用于定义如何将内部路径（pathname）转换为用户可见的路径，如 { as: '/about-us' }。在这个例子中，pathname 属性定义了页面的路径，而 query 属性是一个对象，包含了查询字符串的键值对。pathname: 必需的，页面的路径，如 /about。

原创 css模块

在组件的 JSX 中，你可以通过 styles 对象来访问模块化的 CSS 类名。Next.js 支持 CSS 模块，这是一种将 CSS 样式封装到特定组件中的方法，避免不同组件间的样式冲突。首先，创建一个 CSS 文件，并按照命名约定命名，例如 MyComponent.module.css。通过这种方式，你可以在 Next.js 应用中使用 CSS 模块，实现样式的封装和组件的可重用性。Next.js 通过 [name].module.css 文件命名约定来支持 CSS 模块。

原创 页面预渲染与获取数据的方法

此外，Next.js 拓展了一些功能，比如 fetch 是浏览器的接口，在服务端是不能用的，而在getStaticProps 方法中是可以使用 fetch API 的，咪咪看了下背后使用的是 node-fetch 这个库实现的。传统 React 应用返回的 HTML 文件中，不包含应用的信息，因为页面是在客户端进行渲染的，所以服务端返回的源码通常只有一个 id 为 root 的 div 标签，不利于做 SEO（搜索引擎优化）。SSG 是静态站点生成，就是在文件打包阶段，预先生成页面。为什么要页面预渲染？

原创 端口号localhost：3000被占用，怎么查找并取消被占用

这将显示占用3000端口的程序的PID（进程ID）。然后，你可以通过任务管理器（Ctrl + Shift + Esc）查找该PID并结束相应的进程。要查看哪个程序占用了3000端口，你可以使用命令行工具来检查。在Windows上，你可以使用。请确保在结束进程之前确认该进程不是系统重要的进程，以免造成系统问题。这将显示占用3000端口的进程及其PID。命令，而在Unix/Linux上，你可以使用。

原创 构建tailwindcss

【代码】构建tailwindcss。

原创 tailwindcss配置工作

运行 CLI 工具以扫描模板文件中的类并构建 CSS。将tailwindcss指令添加到css中。启动tailwindcss CLI构建进程。开始在HTML中使用tailwindcss。指令添加到你的主 CSS 文件中。文件中添加所有模板文件的路径。将每个 Tailwind 层的。安装tailwindcss。

原创 tailwindcss的样式

这些工具类覆盖了多种常见的样式需求，包括布局、间距、颜色、字体、边框、阴影、尺寸、响应式设计等。还可以在 Tailwind CSS 的配置文件（tailwind.config.js）中自定义尺寸关键词，以适应你的设计需求。在这个例子中，文本的字体大小在小屏幕上是 text-sm，在中等屏幕上是 text-lg，在大屏幕上是 text-xl。在这个例子中，该元素在小屏幕上有边框，在中等屏幕上是虚线边框，在大屏幕上没有边框。在这个例子中，laptop 是我们自定义的中等屏幕断点。然后在HTML中使用。

原创 路由的六个钩子事件

【代码】路由的六个钩子事件。

原创 API路由

有时您可能想要使用自定义 URL，可能是为了使 URL 更具可读性和语义。

原创 链接到动态路径-使用 URL 对象创建路径

【代码】链接到动态路径-使用 URL 对象创建路径。

原创 命令式路由使用query传递参数和接收参数

这里使用了withRouter，但是文档中推荐使用useRouter。使用typescript，需要严格定义参数类型。不使用url，跳转，修改index代码。虽然程序能跑，但是router会标红。方法复用修改index代码。index.tsx中写入。name.tsx中写入。

原创 静态路由的标签跳转和编程跳转

【代码】静态路由的标签跳转和编程跳转。

原创 Next.js的Page和Component使用

pages下新建一个文件 test.tsx写入在端口号3000后输入/test就能跳转路由页面。

原创 create-next-app快速创建项目

看文档。

原创 手动创建项目

只要写在pages中的文件，next.js会自动进行路由设置。没有下载脚手架，需要手动添加一些命令配置。使用yarn和npm都行。端口3000页面显示。

原创 关于Git中分支的说明

原创 码云的注册和使用

许可证：开源是否可以随意转载，开源但是不能商业使用，不能转载...限制！创建好仓库之后，复制地址，git clone url 克隆到本地。如果公开仓库，那么需要选择许可证。

原创 Git的基本操作命令

原创 Git项目创建及克隆

git文件夹一般是隐藏的，只有在打开文件隐藏目录才会看到。

原创 Git的工作原理（核心）

本地的三个区域确切的说应该是git仓库中HEAD指向的版本：

原创 Git的必要配置

必须要配置用户名和邮箱。

原创 常用的Linux命令