weixin_48112768-优快云博客

DockerfileFROM nginxWORKDIR /usr/share/nginx/html/USER rootCOPY ./docker/nginx.conf /etc/nginx/conf.d/default.confCOPY ./dist /usr/share/nginx/html/EXPOSE 80CMD ["nginx", "-g", "daemon off;"]docker/nginx.confserver { listen 80; # g

2022-05-15 09:17:45 96

原创 useMemo,useCallback理解

# 注意useCallback(fn,[dep])这里主要是用作缓存函数<APP> const [count,setCount] = useState(0) const add = ()=>{}return <> {count} <button onClick={()=>setCount(count + 1)} /> <Child > </Child> </>

2022-05-14 12:18:26 116

原创 react-hooks父组件调用子组件方法forwardRef

import React, { forwardRef, useImperativeHandle } from 'react'import { Button } from 'antd'export default function Category() { const domRef = React.useRef() const handleClick = () => { // @ts-ignore domRef.current.handleClick() } retu

2022-05-03 14:23:39 1958

原创 Warning: Can‘t perform a React state update on an unmounted component. This is a no-op, but it indic

componentWillUnmount() { // fix Warning: Can't perform a React state update on an unmounted component this.setState = (state, callback) => { return; }; }

2022-04-29 18:01:35 334

原创 react-umijs如何使用dva

## 4-如何使用dva状态1.准备接口mock```js# 根目录mock/api.tsimport mockjs from 'mockjs';export default { // 支持值为 Object 和 Array 'GET /api/users': { users: [1, 2] }, // GET 可忽略 '/api/users/1': { id: 1 }, // 支持自定义函数，API 参考 express@4 'POST /api/users/cr

2022-04-26 12:04:07 234

原创 1.前端面试题笔试

<body> <button>防抖</button> <script> // const array = [ {label:'1',value:'a'},{label:'2',value:'b'}] // 给一个这个数组把数组变成对象 // { // a:'1', // b:'2' // } const array = [

2022-04-25 16:38:26 166

原创创建create-react-app失败

清理npx 缓存----> npx clear-npx-cachenpm uninstall -g create-react-app yarn global remove create-react-appnpx create-react-app my-appcd my-appnpm start``

2022-04-22 01:53:20 1137

原创 react中props属性类型校验定义(未使用ts)

import React from 'react'import { useState } from 'react'import PropType from 'prop-types'// 生成Demo 类组件class Demo extends React.Component { render() { return ( <div> <h1>{this.props.money + 100}</h1> <h2

2022-04-18 15:21:22 711

原创 react-useContext跨组件通信

useContext# 一般app 或者是index.jsx根组件import { createContext } from 'react'export const Context = createContext()state = { count:100}return <Context.Provider value={{ count:this.state.count }}> <Context.Provider/>

2022-04-18 14:53:00 415

原创 vue封装通用的函数挂在原型上

export function showMessage( title = '获取数据失败', duration = 2000, icon = 'none') { uni.showToast({ title, duration, // @ts-ignore icon, })}main.js中导入import Vue from 'vue'import App from './App'import http from './utils/reque

2022-04-12 17:07:34 512

原创前端千分位计算---＞逗号

console.log(Number('20000.23').toLocaleString())VM279:1 20,000.23

2022-04-12 13:35:07 83

原创 mock使用

===>npm i mockjs===>新建mock文件夹，`index.js` import Mock from 'mockjs'// mock的配置Mock.setup({ // 随机延时500-1000毫秒 timeout: '500-1000'})// 拦截请求，// 第一个参数：url，使用正则去匹配// 第二个参数：请求方式// 第三个参数：生成数据的函数Mock.mock(/\/home\/category\/head/, 'get', ()

2022-04-11 18:38:10 145

原创 common.js规范

1.======> 目录utils/common.jsfunction toUpcase(params) { return params ? params.toUpperCase() : ''}module.exports = { toUpcase}组件调用函数 onLoad: function (options) { console.log(options); console.log(common.toUpcase('hello.

2022-04-11 00:38:36 73

原创手动开启一个本地服务express

npm install -g serve# -s 参数的意思是将其架设在 Single-Page Application 模式下# 这个模式会处理即将提到的路由问题serve -s dist1. 创建express 服务2. 托管dist 目录3. 配置 npm script "preview":'node test-serve/app.js'4. 配置proxy# 在根目录创建一个文件夹 test-serve/app.js# yarn add express -D# npm in

2022-03-27 11:41:11 510

原创 wangeditor富文本编辑器的使用

wangeditor富文本编辑器1.inithttps://www.wangeditor.com/npm i wangeditor --save2封装一个独立的组件<template> <div class="editor" ref="editor"></div></template><script>import Vue from 'vue'import E from 'wangeditor'export defau

2022-03-26 10:48:30 663

原创 elementui-upload自定义上传方式上传到服务器返回url:http

1-先封装一个uploadImage.vue组件<template> <div class="photo"> <el-upload class="avatar-uploader" action="https://jsonplaceholder.typicode.com/posts/" :show-file-list="false" :on-success=

2022-03-25 16:59:09 1762 4

原创前端axios请求参数格式

import request from '@/utils/request'import qs from 'qs'interface User { mobile:string, code:string}// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-typesexport const login = (data: User) => {// request.post('/v1_0

2022-03-23 00:17:40 1154

原创 react实现popup中间弹出内容点击遮罩层关闭

import React, { useState } from 'react'import styles from './index.module.scss'export default function PopupCnter() { const [state, setState] = useState(true) const handleClick = (e) => { setState(false) } return ( <div> &l

2022-01-15 21:37:46 825

原创 React实现一个Popup

react学习者import React, { useState } from 'react'import styles from './index.module.scss'export default function PopupCnter() { const [state, setState] = useState(false) return ( <div> <div className={styles.root}> <bu

2022-01-13 21:48:34 845

原创 json-server使用

#第一步全局安装yarn global add json-server在根目录/ 创建json文件例如: data.json 写入数据{“todos”:[{“id”:1,“name”:“吃饭”,“done”:false},{“id”:2,“name”:“睡觉”,“done”:true},{“id”:3,“name”:“打豆豆”,“done”:false},]}3.最后一步开启本地服务终端: json-server data.jsonhttp://localhost:3000/t

2022-01-01 11:12:32 371

原创 2021-08-19黑马Jq+Echarts实战

效果图如上在这里插入代码片```$(function () { let name = $('.add .username') let score = $('.add .pf') let salary = $('.add .salary') let dataArr = JSON.parse(localStorage.getItem('todolist')) || [] load() fn(dataArr) zhexian(dataArr) .

2021-08-20 10:30:31 187

原创 2021-08-16前端todolist实现js文件

/* 需求：功能1：在输入框中输入任务内容，按回车键时添加一个任务（20分）要求1：添加到任务列表的最顶部要求2：添加完成后，需要清空原来的内容。要求3：要有非空的判断，如果任务内容为空，alert提示 "任务名称不能为空" 功能2：任务删除功能，点击任务中的删除按钮，能够删除当前任务（10分）功能3：任务状态修改功能，点击checkbox，要求能够修改任务的完成状态。（10分）提示：当checkbox选中时，需要给li添加completed类，当checkbox不选

2021-08-17 13:26:22 102

原创 JAVA数组添加元素

package cn.itcast.day04.arrInsert;public class demo {public static void main(String[] args) {int[] arr = {10,56,121,45,89};//遍历之前打印数组for(int i = 0;i<arr.length;i++){if (i == arr.length -1){System.out.print(arr[i]);}else {System.out.print(arr[i]

2020-11-06 16:33:26 880

原创 JAVAOooooo。。。。。ooo0000OOOOO

package cn.itcast.day04.demo01;import java.util.Arrays;public class maopao {public static void main(String[] args) {int[] arr = {10,400,666,21,9};System.out.println(“排序前：”+Arrays.toString(arr)); **//arr.length不减1 的话就要索引越界异常 **/* for (in

2020-10-29 14:24:26 263

原创 4.Java冒泡排序

public class Maopao {public static void main(String[] args) {int[] array = {12,15,48,54,10,89,45,3,46,78,111,4};System.out.println(“排序前的数组为：”);System.out.print("[");for (int i = 0; i < array.length; i++) {if(i == array.length-1){System.out.print(

2020-10-23 16:51:35 76

原创 3.SSH服务三台主机实现基于key验证

主机 A 和另外两台主机 B Cssh-keygenssh-copy-id A（登陆地址）例如：A=root@192.168.1.2A: scp -rp /root/.ssh B:/root/A: scp -rp /root/.ssh C:/root/

2020-09-29 10:17:34 133

原创 2.远程服务端失败的状况：

2.远程服务端失败的状况：[root@localhost ~]#vim ~/.ssh/known_hosts 删除如下保留的信息再次连接即可成功

2020-09-24 19:37:23 117

怎样在Win7系统里安装FTP.docx

空空如也