函数组件使用Context
https://zh-hans.reactjs.org/docs/hooks-reference.html#usecontext
直接上代码
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172import PropTypes from 'prop-types';import { createContext, useState, useEffect } from 'react';// materialimport { useMediaQuery } from '@material-ui/core';import { useTheme } from '@material-ui/core/styles';// -------------- ...
项目中用到的包
npm i react-helmet-async
jss-rtl用于使用 JavaScript 生成样式表的库。
framer-motion
nprogress 进度条
mui
Live2d部件模型
live2d-widget-model-chitose
live2d-widget-model-epsilon2_1
live2d-widget-model-gf
live2d-widget-model-haru/01 (use npm install –save live2d-widget-model-haru)
live2d-widget-model-haru/02 (use npm install –save live2d-widget-model-haru)
live2d-widget-model-haruto
live2d-widget-model-hibiki
live2d-widget-model-hijiki
live2d-widget-model-izumi
live2d-widget-model-koharu
live2d-widget-model-miku
live2d-widget-model-ni-j
live2d-widget-model-nico
live2d-widget-model-nietzsche
...
React18 新特性
自动批处理使用set函数时不会像之前执行一个set函数渲染一次界面(更改一个状态渲染一次界面),会等到某一处理函数中set函数都执行完了之后渲染界面(只在最后渲染界面)example
12345678910111213141516171819const handleClick = () =>{ setIsFetching(false); setStatus('success');}// Before: only React events were batched.setTimeout(() => { setCount(c => c + 1); setFlag(f => !f); // React will render twice, once for each state update (no batching)}, 1000);// After: updates inside of timeouts, promises,// native event handlers or any othe ...
Drupal主题更改,相关配置
Drupal 主题设置使用 DDEV 安装 Drupal 环境
安装ddev1$ curl -LO https://raw.githubusercontent.com/drud/ddev/master/scripts/install_ddev.sh && bash install_ddev.sh
搭建环境 # Replace my-site-name1234567$ export SITE_NAME=my-site-name$ mkdir $SITE_NAME$ cd $SITE_NAME$ ddev config --project-type=drupal9 --project-name $SITE_NAME --docroot=web --create-docroot
启动 DDEV 容器1$ ddev start
创建drupal应用程序
如果您的机器上没有安装 Composer,到官网上下载安装,或者使用my-site-nameddev composer
开始安装123$ ddev composer create "drupal/recommen ...
Hexo博客搭建,主题配置
文档 https://hexo.io/zh-cn/docs/
1.准备工作本地下载安装 nodejs
安装hexo-cli
1& npm install -g hexo-cli
2.初始化本地新建一个文件夹Blob,终端输入下面命令,或者手动创建文件夹
1$ mkdir Blob
1$ hexo init Blob
初始化完成之后
1$ cd Blob
1$ npm install
1$ hexo s
访问http://localhost:4000/
3.hexo 常用命令
命令
描述
hexo init [folder]
初始化博客,将博客基本模块下载到本地folder下面
hexo new [layout] [blob title]
创建博客文章,layout指定使用布局,不指定则使用默认布局,blob title 博客文章标题
hexo clean
清理缓存文件(db.json)和生成的public
hexo s 或 hexo server
本地启动站点,访问localhost:4000
hexo g 或 hexo generate
生成部 ...