- 博客(93)
- 收藏
- 关注
RSS订阅原创 Flutter问题记录
1.环境搭建1-1. android环境问题问题描述：sdkmanager没有安装path/to/sdkmanager --install "cmdline-tools;latest解决方法：按照下面方式，安装勾选的那个即可1-2.flutter指令一直卡在那边问题描述：VersionCheckError: Command exited with code 128: git fetch __flutter_version_check__ stableStandard e
2021-10-19 10:41:37
2697
原创 Vue3.0 初体验
1. createApp<!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" /&g
2021-05-06 09:29:36
291
原创 react-router
1.react-router-dom的原理（hash和history）<!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,
2021-03-09 14:15:48
181
原创 redux-thunk,redux-saga的使用
1. redux-thunk// store/index.jsimport { createStore, applyMiddleware, compose } from "redux";import reducer from "./reducer";import thunk from "redux-thunk";const sagaMiddleWare = createSagaMiddleWare(); const composeEnhancers = window.__REDUX..
2021-03-09 14:10:22
225
原创 react-redux的原理，react-redux的使用
1.react-redux的原理// react-redux/context.jsimport { createContext } from "react";const StoreContext = createContext(null);export { StoreContext };// react-redux/connect.jsimport React, { Component } from "react";import { StoreContext } from
2021-03-09 13:55:24
154
原创 context,redux的使用
1.Context的使用import React, { Component, createContext, PureComponent } from "react";const UserContext = createContext({ name: "张三", age: 18,});const FnContext = createContext({ sex: "男",});/* context在类组件的使用 */class Child extends PureCompon
2021-03-09 13:47:17
291
原创 styled-components,classnames,antd的使用
1.styled-components的使用import React, { Component } from "react";import styled, { ThemeProvider } from "styled-components";import styles from "./css/styled.module.css"; // 测试 css modules// 基础用法 + 嵌套 + 伪类 + 伪元素const ContentWrap = styled.div` paddi
2021-03-09 13:37:03
1694
原创 State,Ref,PureComponent的使用
1. setState的使用import React, { Component } from "react";import styled, { ThemeProvider } from "styled-components";function Child(props) { return <p>{props.name}</p>;}const TTest = styled.p` font-size: ${(props) => props.theme.fo
2021-03-09 13:30:04
236
原创 Koa插件使用
1.基本使用const Koa = require("koa"); // 获取koaconst bodyParser = require("koa-bodyparser"); // body中间件// const static = require("koa-static"); // 静态服务器中间件const path = require("path");const KoaRouter = require("@koa/router"); // 路由包const views= require(
2020-12-31 16:40:59
346
原创 Ts的接口
1.对json进行限制interface JsonFomat { name: string; // 必须存在name readonly age: number; // 必须存在age [propName: string]: any; //其他属性，可有可无}let json1: JsonFomat = { name: "张三", age: 18,};let json2: JsonFomat = { name: "张三", age: 18, defineName
2020-12-31 15:30:06
385
原创 Ts的类
1.修饰符public 公有 父类（自身）以及子类和外部都能访问protected 受保护 父类（自身）以及子类都能访问 但是外部不能访问private 私有的 父类（自身）可以访问 但是子类和外部不能访问2.基本使用class Person { // name: string; static age: number = 18; // 静态属性 // constructor(name: string) { // this.name = name;
2020-12-31 15:23:57
589
原创 Ts的函数
1.函数匿名函数void无返回值function f1(): void { console.log(1);}let f2 = function (): void { console.log(1);}; // 匿名函数// type 定义类型别名type F22 = (x: string, y: number) => string;let f22: F22 = function (a, b) { return a + b;};let f222: F22 = f...
2020-12-31 15:19:47
791
原创 Ts的数据类型
1.booleanlet flag: boolean = true;2.numberlet a: number = 1;3.stringlet str: string = "这是个字符串";4.arraylet arr1: number[] = [1, 2, 3];let arr2: Array<number> = [1, 2, 3];5.元组[定义数组每一项的类型，一般可以用any替代]let arr3: [number, string] = .
2020-12-31 15:15:30
1353
原创 nodejs的http
1.http的常规使用const http = require("http");const urlPkg= require("url");const server = http.createServer((req, res) => { if(req.url==='/favicon.ico') return; const method= req.method.toLowerCase(); // 获取请求的方法 const url= urlPkg.parse(req.url,tru
2020-12-10 14:49:09
171
原创 nodejs的文件流 stream
1.文件可读流const fs= require("fs");const stm =fs.createReadStream("./file.txt",{ flags: "r", // 读取模式 autoClose: true, // 读取完毕自动关闭流 emitClose: true, start: 3, // 开始位置 end: 11, // 结束位置 highWaterMark: 6 // 一次文件读取的最大量【内存开辟大小】});l
2020-12-10 14:29:48
1080
原创 commander的使用和npm的介绍
1.commanderconst commander = require("commander"); // 第三方包const chalk = require("chalk");console.log(chalk.green("====参数的解析和commander的简单使用===="));commander.name("node"); // 名字介绍commander.usage("<path file>"); // 使用方式介绍commander.version("1.0.
2020-12-10 14:11:42
3984
1
原创 nodejs的events事件
1.events的使用const EventEmitter = require("events");const util = require("util");// const event = new EventEmitter(); //这是直接实例化eventsfunction Man() {}util.inherits(Man, EventEmitter); // 实现原型的继承const event = new Man(); // 区别到具体的类，实例化类event.o
2020-12-10 13:50:57
266
原创 nodejs的Buffer
1.buffer常用方法// nodejs的中文是三个字节let buf = Buffer.from("珠峰"); // 参数是string 建立内存空间let buf1 = buf.slice(0, 3); // 截取内存console.log(buf1); // <Buffer e7 8f a0>console.log(buf1.toString()); // 珠buf1[0] = 100; // 这里修改了第一个字节console.log(buf1); // <
2020-12-10 13:41:07
253
1
原创 nodejs的Fs模块
1.读文件const fs = require("fs");const path = require("path");const resolve = (url) => path.resolve(__dirname, url);// 同步读取function readWriteFileSync(path, wPath) { let content; try { content = fs.readFileSync(path); // 读取内容 fs.appendF
2020-12-10 11:34:11
220
原创 nodejs常用全局变量
1.processconst chalk = require("chalk"); //第三方包，让console有颜色console.log(chalk.green("====常见全局变量的演示===="));console.log( process.platform, chalk.grey("平台 一般是win32(windows)和darwin32(os,mac)"));console.log(process.env.JAVA_HOME, chalk.grey("环境变量 env
2020-12-10 11:21:19
603
原创 笔记
3DTagClond 云标签react-use hooks的方法库react-router-config 路由权鉴react-keep-alive 路由缓存react-json-view json数据展示react-free-scrollbar 滚动条pubsubjs 发布订阅pace.js 加载页面进度条
2020-09-02 10:09:48
67
原创 hook
1.Sass的镜像配置yarn config set sass_binary_site http://cdn.npm.taobao.org/dist/node-sass -g
2020-08-27 15:42:42
168
原创 前端架构
1.全局样式从产品到UI，主题色，字体大小，字体，间距，颜色的指定，此时可以总结出，尽量解耦2.UI库分基础组件(通用组件)+业务组件(异步组件，动态组件)3.工具tool针对业务，公用的方法，ajax的封装，国际化等4.路由自动化路由，根据文件名称自动生成路由模块化路由，针对模块，将路由进行模块文件区分5.全局组件使用性特别高的组件，进行全局自动化注册，根据文件名或者vue的name属性6.api(接口)6-1.针对接口的api，进行接口api化(方法形式的
2020-05-12 10:32:09
598
原创 Vue的小技巧
1.自动注册组件(require.context)components/index.js 将其封装成vue插件，提供installconst requireComponents = require.context("./common", false, /\.vue$/);console.log(requireComponents.prototype);function to...
2020-04-26 11:06:34
284
原创 前端性能优化
1.加载文件时间少，少加载文件1. dns prefetch 页面用到域名可以dns预请求2. preload 首屏需要的关键文件css，js可以预先加载3. prefetch 首屏用不到的文件，页面加载时用不到的文件，后面页面可能会用到，可以延迟加载【可以配合webpack 组件懒加载，路由懒加载等】4. iconfont 雪碧图 小图片处理方式 减少请求, 图片懒加...
2020-04-22 10:56:48
124
原创 Vue的UI组件库的开发
1.Vue插件的开发要使用Vue.use(),就要在插件里面暴露一个install方法install里面配合Vue.Component进行全局注册，或者局部注册插件[不使用Vue.use]2.开发目录packages下的index.js:这个是最后插件导出的js文件，用于插件的汇总，提供install方法packages/button 这是组件库下的一个but...
2020-04-17 14:44:59
702
原创 面试
1.数据类型/** * 值类型: Number,String,null,undefined,Boolean * 引用类型：Object,Function * 扩展：NaN不是一个有效数字，但是是Number类型的，判断是不是NaN用isNaN[true就表示是非数字] * Object的key不能是引用类型,默认会把引用类型转化成字符串---比如{x:1}会转化成[object O...
2020-02-15 21:10:26
237
原创 React 笔录(渲染原理和react-redux的connect简单实现)
1.createElement,render方法的简易手写\index.js 要实现的功能:import React, { Component } from "./mReact";import ReactDOM from "./mReact-dom";function Comp(props) { return <h2>{props.name}</h2&g...
2019-12-18 14:07:20
186
原创 React Native 学习笔录一
组件具体的API参考官网：React Native API1. View，Text,StyleSheet// View类似Div，但是不能直接写内容// 样式没有class，只有style，通过 StyleSheet进行创建// 样式没有px，宽高，字体等数字都是没有单位的，会自动转化，安卓dp，苹果pt// flex布局中 flexDirection默认是colu...
2019-11-15 11:45:14
203
原创 React学习笔录三 Redux-saga UmiJs dva
1. redux-saga官方文档地址// redux-thunk 和 redux-sagaredux-thunk的action要返回函数，这本身已经破坏了react的action的初衷(是个对象)redux-saga的action还是对象，符合react的要求redux-saga 对于副作用(数据获取，浏览器缓存获取),易于管理，执行，测试和失败处理，对复杂逻辑能够很好的支...
2019-11-08 12:02:58
675
原创 React学习笔录二 + React Router+Redux-thunk+Redux-logger
1.组件化react组件化跟vue有所区别，容器组件 VS 展示组件状态的维护，数据获取，逻辑的处理尽量在容器组件里面展示组件尽量是傻瓜式的，纯粹的页面展示的组件，输入props就能知道展示出来是啥样，不包含状态逻辑的处理2. PureComponent展示型组件可以配合PureComponent，不过要注意几点：2-1. 改变引用的数据，PureComponent是没有效...
2019-11-04 15:08:28
323
原创 Vue记录
1.双向绑定和单向数据流vue是单向数据流，父组件通过属性props传值给子组件，子组件也是通过emit修改父组件的属性双向绑定(单个 v-model 多个 .sync )双向绑定是一种语法糖，依然是遵循单向数据流，是通过Object.defineProperty来做响应式更新2. 列表的key值不要用index，用唯一值(例如id)当你用index作为key时，虚拟dom是...
2019-10-29 10:39:42
219
原创 git学习笔录二
1.本地库和远程库建立连接git remote add 本地库名字(upstream,origin都可,自定义) 远程库地址// 本地查看远程库git remote -v// 删除远程连接git remote rm 名字(origin,upstream之类的)2. 分支和远程库建立连接(不建立的话，git pull, git push的简写方式是不行的)git b...
2019-10-23 10:20:13
121
原创 git命令学习笔录一
1. git最小配置 name && emailgit config --global user.name 'your_name'git config --global user.email 'youer_email@qq.com'--global 当前用户的所有仓库 (个人home目录下的.gitconfig里面,例如：C:\Users\74986)--l...
2019-10-18 16:54:37
176
原创 webpack4 enrty,output,library,babel7,publicPath,SplitChunks,多页面,postcss,eslint,stylelint,gzip
1.安装npm init -y //生成默认的package.json文件npm i webpack webpack-cli --save-dev //安装在 devDependencies依赖里面2.默认配置文件 webpack.config.js./node_modules/.bin/webpack //运行此指令，没有指令配置文件，默认是 webpack.confi...
2019-09-20 15:19:30
452
原创 Redux, Redux-saga,React-redux,Immer,Reselect,State范式化
1.概念1-1.整个应用的state被储存在一棵 object tree 中，并且这个 object tree 只存在于唯一一个store中1-2.唯一改变 state 的方法就是触发action，action 是一个用于描述已发生事件的普通对象1-3.为了描述 action 如何改变 state tree ，你需要编写reducers(纯函数)2. action...
2019-09-16 17:51:18
482
原创 React fiber(React 16) 学习笔录
1.脚手架安装npx create-react-app 项目名2.JSX语法//如果需要使用JSx的语法糖，则必须引用Reactimport React, { Component } from 'react';// Component只是es6的解构赋值语法3.class语法的本质//Test.jsimport React, { Component } fro...
2019-09-03 12:02:00
175
原创 flutter 指令
1.flutter run 执行项目2.flutter create 名字 //创建application项目3.flutter doctor //诊断配置4.flutter create -t module 名字 //创建模块 用于混合开发5.flutter attach //混合开发 连接进行热加载6.flutter attach -d 设备id //多个设备时...
2019-08-27 17:01:38
844
原创 flutter动画 Animation,Curve,AnimationController,Tween,Hero
1.AnimationAnimation是一个抽象类，它本身和UI渲染没有任何关系，而它主要的功能是保存动画的插值和状态；其中一个比较常用的Animation类是Animation<double>。Animation对象是一个在一段时间内依次生成一个区间(Tween)之间值的类。Animation对象在整个动画执行过程中输出的值可以是线性的、曲线的、一个步进函数或者任何其他曲线函数...
2019-08-21 17:21:36
4321
原创 flutter 拍照实例 image_picker的使用
1.安装2.引用import 'package:image_picker/image_picker.dart';3.示例import 'package:flutter/material.dart';import 'package:image_picker/image_picker.dart';class Photo extends StatefulWidget {...
2019-08-19 14:52:07
2666
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人