- 博客(26)
- 收藏
- 关注
RSS订阅原创 递归反转字符串
function rev(num) { let num1 = num / 10 let num2 = num % 10 return num1 < 1 ? num + '' : `${num2}${rev(Math.floor(num1))}`}console.log(rev(123)); //321
2022-05-04 09:39:54
104
原创 45°打印矩阵
var arr = [ [1, 2, 3], [4, 5, 6], [7, 8, 7]]function print(arr) { let res = [] let max = (arr.length - 1) * 2 for (let i = 0; i <= max; i++) { let x = 0, y = i for (; y >= 0; x++, y--) { if (x < arr.length && .
2022-04-29 11:49:26
380
原创 css实现1/4圆弧的loading一直转圈的效果
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <tit.
2022-04-26 09:27:04
388
原创 js数组分割
编写一个函数,把一个数组arr按照指定的数组大小size分割成若干个数组块。例如:chunk([1,2,3,4],2)=[[1,2],[3,4]];chunk([1,2,3,4,5],2)=[[1,2],[3,4],[5]];function chunk(arr, num) { let a = [[]] let m = 0 for (let i = 0; i < arr.length; i++) { if (i > 0 && i % num ==
2022-04-26 09:17:12
1697
原创 快速排序，js， 6行代码
参考Bret Victor 大神function quickSort(nums) { if (nums.length <= 1) return nums const mid = nums.splice(Math.floor(nums.length / 2), 1)[0] let left = nums.filter(item => item < mid) let right = nums.filter(item => item >= mid) retu
2022-04-16 20:04:32
48
原创 Vue3全局自定义指令
官网有介绍，这里不多叙述，展示一下用法建一个工具函数js文件import dayjs from 'dayjs'export default function (app) { app.directive('focus', { mounted (el) { el.focus() } }) app.directive('format-time', { mounted (el, binding) { console.log(binding.v.
2021-09-24 18:08:48
1197
原创 vue动态添加active
:class="{active: currentIndex === index}":class="currentIndex == index ? 'active' : ''"
2021-05-25 22:26:53
794
原创 在styled-components中引入外部图片
比如引入一张背景图片先import pic from '@/assets/img/sprite_footer_01.png'再background-image: url(${pig});
2021-05-24 12:50:23
1634
1
原创 Javascript ES6中数组去重最简便的两种方法（大概）
1.Set 先利用Set创建类数组数据结构实例set，再利用set中会自动去重的特性，最后用扩展运算符将set赋值给新数组var arr = ['a', 'b', 'c', 'a'] var set = new Set(arr) var newArr = [...set] console.log(newArr);2.includes先遍历数组，再利用includes方法，判断新数组中是否有旧数组中的元素，没有的话就把当前元素添加到新数组 var arr =
2021-05-19 22:34:03
800
原创 useEffect和useLayoutEffect的区别
useEffect会在页面状态更新到DOM之后再执行，就是说页面会先渲染一下，如果useEffect里面更改了页面state，就会再在页面上渲染一下被改变的state，页面发生了两次渲染而useLayoutEffect是在页面状态更新到DOM之前就会回调，虽然内部state改变顺序和useEffect一样，但是页面渲染最后一次import React,{useEffect,useState} from 'react'export default function UseEffect()
2021-05-14 14:13:15
439
原创 React 报错 Too many re-renders. React limits the number of renders to prevent an infini
写hooks遇到的，大概率是this的问题，标签里写成箭头函数<button onClick={() => setCounter(counter + 1)}>+1</button>或者用bind绑定thisonClick={increment.bind(this)}建议用第一种如果解决了给个赞吧！...
2021-05-13 19:37:33
2125
原创 Hooks----useContext的使用
provider：（和原生的一样）import { createContext } from 'react'import Usecontext from './04.useContext/useContext的使用'export const UserContext = createContext()export const ThemeContext = createContext()export default function App () { return ( <d
2021-05-13 19:22:56
137
原创 redux,setState()和pureComponent的冲突问题（坑）
使用redux保存状态并且用this.setState()来刷新页面的时候，react组件就不能继承自pureComponent了其实道理很简单因为pureComponent是检测当前组件的state和props变化的，只有这俩发生变化，调用this.setState({})才会触发render()刷新页面，redux的变化和当前组件的state以及props无关，所以页面不会刷新...
2021-05-09 19:49:28
193
原创 axios
// 2.axios发送基本的网络请求 // axios({ // url: "https://httpbin.org/get", // params: { // name: "why", // age: 18 // } // }).then(res => { // console.log(res); // }).catch(err => { // console.error(er
2021-05-07 21:51:38
111
原创 React ref 的使用
import React, { PureComponent, createRef } from 'react'export default class App extends PureComponent { constructor(props) { super(props) this.titleRef2 = createRef() this.titleRef3 = null } render() { return ( <div>
2021-05-05 11:19:20
927
原创 React中setState合并
this.setState中的操作默认会合并import React, { Component } from 'react'export default class App extends Component { constructor() { super() this.state = { counter: 0 } } render () { return ( <div> <h2>{this.s
2021-05-04 13:55:08
844
原创 React利用context进行非父子组件传参
虽然这种方式现在很少用了，但还是了解一下1.首先是类组件import React, { Component } from 'react'const UserContext = React.createContext({ name: 'aaa'})class Header extends Component { render () { // console.log(this.context); return ( <div> <h
2021-05-03 22:41:30
187
原创 React实现插槽的两种方式
由于在React组件中写的内容会被挂载到props中，以此来实现类似vue中的插槽功能首先这是我的主页代码1.用this.props.children[index]import React, { Component } from ‘react’import ‘./style.css’export default class NavBar extends Component {render () {return ({this.props.children[0]}{this.props
2021-05-03 18:17:58
5102
原创 Vue devtools工具中Vuex的State不能立即变化
想必有人跟我一样遇到这种情况，页面数据更新，但是State不能立即变化，如下：counter1不能响应式变化，解决方法很简单，先点击红点的位置然后在设置里面打开这个
2021-04-05 17:24:37
1210
原创 Javascript 中的模板字符串问题
Javascript 中的模板字符串问题var foo = `大家好hello 你好world哈哈哈`console.log(foo)结果为:大家好hello 你好world哈哈哈原封不动输出，支持换行当你采用了无分号的代码风格的时候（就是代码末尾不加分号 例如console.log(a） 这行代码末尾不加分号 很多前端省事这样写哈哈)假
2021-03-11 20:37:13
387
原创 C++setw函数的运用
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
2020-11-28 19:27:00
8202
6
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人