starry__sty的博客

React函数组件路由和组件

starry__sty — Fri, 30 Jul 2021 20:40:27 +0800

函数组件路由和组件路由SPASPA的切换机制前端路由React Router安装组件BrowserRouter 组件HashRouter 组件Route 组件exactLink组件to属性作用使用:传递propsNavLink组件activeStyleactiveClassNameisActivewithRouter 组件(高阶组件，高阶函数，高阶路由)Switch 组件Redirect 组件hooks (*Router5.0之后出现的*)路由参数history :历史记录以及路由给我们提供的一些操作loc

React类组件的属性和函数组件里的hooks

starry__sty — Thu, 29 Jul 2021 20:48:07 +0800

React类组件的属性和函数组件里的hooksPureComponentrefchildrendangerouslySetInnerHTMLkey函数式组件hook作用常用hookuseStateuseEffectuseRefHook 使用规则自定义组件 PureComponent PureComponent 提供了一个具有浅比较的 shouldComponentUpdate 方法,其他和 Component 完全一致; import React,{PureComponent,Component} from

React生命周期,受控组件和非受控组件

starry__sty — Tue, 27 Jul 2021 19:26:56 +0800

state和setState state:里面存放的是数据; setState(updater,callback) :用来修改state里面的值 updater:更新数据是一个function/object callback:更新成功后的回调函数(很少用) 异步:react 通常会集齐一批需要更新的组件,然后一次性更新来保证渲染的性能浅合并 Object.assing() 组件通信在react中,是单向数据流,因此父组件可以把state通过props传递给子组件,但是子组件不

初始React,创建脚手架

starry__sty — Mon, 26 Jul 2021 21:26:58 +0800

1.概念: 他是用于构建用户界面的 JavaScript 库; 2.官网: 中文:https://reactjs.bootcss.com/ 英文:https://reactjs.org/ 3.使用: 基础: ReactDOM 提供了与浏览器交互的 DOM 功能，如：dom 渲染 ReactDom.render(element,container,callback) element: 元素(内容); container:内容存放的容器; callback:回调函数(可选) //引入Rea

typescript基础(5)

starry__sty — Fri, 02 Jul 2021 19:39:17 +0800

模块: 把公共的一些功能单独抽离成一个文件作为模块; 模块里面的变量, 函数,类等默认都是私有的,如果我们需要在外部访问模块里面的数据(函数,变量,类),我们就需要暴露模块里面的数据,然后通过import引入模块就可以使用模块内的数据; 暴露模块export: // 方式一 export function a(){ ... } // 方式二 function a(){ ... } export { a }

typescript基础(4)

starry__sty — Thu, 01 Jul 2021 19:17:10 +0800

类: ES5的类和继承 function Person(){ this.name='张三'; this.age=18; this.run=function(){ alert(this.name+'在跑步') } } //原型链 //通过原型链添加属性 // 注意:原型链上的属性会被多个实例共享,构造函数的属性不会

typeScript的基础(3)

starry__sty — Wed, 30 Jun 2021 20:22:12 +0800

一:TypeScript是什么? 他是以javascript为基础构建的语言; 他是一个javascript的超集; 可以在任何支持javascript的平台中执行; 他扩展了javascipt并添加了类型系统; 注意:Ts不能被解析器直接执行二、Typescript安装编译在使用npm命令之前电脑必须得安装nodejs 安装 npminstall-gtypescript 或者 cnpminstall-gtypescript 或者 yarnglobaladdtypescri

typeScript变基础(2)

starry__sty — Tue, 29 Jun 2021 20:32:29 +0800

变量和数据类型 1.什么是变量? 变量:用来存储数据得容器,并且是可以变化的; 2.变量的使用? 变量的使用分为两步：1 声明变量并指定类型 2 给变量赋值。第一步：声明变量并指定类型 let age: number; 解释： let 是 TS 的关键字，用来声明变量。 lage 是程序员自己定义的变量名称。 : number 用来指定变量 age 为数值类型。注意：分号是可选的，可省略. 第二步:给变量赋值; age = 18; 解释：l 使用等号（=）来

TypeScript基础(1)

starry__sty — Mon, 28 Jun 2021 21:08:53 +0800

一:TypeScript是什么? 他是以javascript为基础构建的语言; 他是一个javascript的超集; 可以在任何支持javascript的平台中执行; 他扩展了javascipt并添加了类型; 注意:Ts不能被解析器直接执行二.TypeScript增加了什么? 1.类型; 2.支持ES的新特性; 3.支持Es不支持的新特性; 4.丰富的配置选项; 5.强大的开发工具; 三.TypeScript 程序由以下几个部分组成：模块

微信小程序生命周期以及创建项目

starry__sty — Fri, 25 Jun 2021 19:57:40 +0800

5.小程序生命周期他分为应用生命周期和页面生命周期 5-1.应用生命周期: https://developers.weixin.qq.com/miniprogram/dev/reference/api/App.html onLaunch : 应用第一次启动就会触发的事件作用:在应用第一次启动的时候就能拿到用户信息 onShow : 应用被用户看到; 作用:当应用的数据或者页面效果发生改变重置 onHide : 应用被隐藏作用: //暂停或者清除定时器 onError

vscode里less生成css 以及小程序组件

starry__sty — Thu, 24 Jun 2021 20:56:34 +0800

vscode中小程序把less编译成css 第一步: 在vscode中下载less插件第二步，配置settings.json文件（文件 - 首选项 - 设置 - 搜索设置settings.json）加入如下代码： "less.compile": { "outExt": ".wxss" } 如下: 这时候如果在less文件中写代码,保存后会自动生成一个.WXSS的文件: 4-1-3:注册组件在组件的js⽂件中，需要使⽤Component()来注册组件，并提供组件的属性

微信小程序bug和基础(3)

starry__sty — Wed, 23 Jun 2021 19:34:50 +0800

微信小程序网络连接失败一直显示网络连接失败,百度查说是把防火墙关掉,再不行,在防火墙允许的应用里加上微信小程序还是不行; 最后终于找到解决办法: .1.win+r 输入cmd，打开命令提示符窗口 2.2.输入命令： netsh winsock reset 按回车键执行命令 3.根据成功后的提示，重启计算机 ...

微信小程序基础（2）

starry__sty — Tue, 22 Jun 2021 20:57:07 +0800

1.小程序事件绑定⼩程序中绑定事件，通过bind关键字来实现,bindtap,bindinput``bindchange等; 1-1.wxml 1-2.js Page({ data:{ num:0 }, handelInput(e){ this.setData{ num:e.detail.value }

详细安装微信小程序以及微信小程序基础(1)

starry__sty — Mon, 21 Jun 2021 19:48:29 +0800

1.小程序是什么? 微信小程序,简称小程序,是一种不需要下载安装就可以使用的应用; 2.为什么用小程序? 2-1.微信有很多用户,在微信里开发产品更容易接触用户; 2-2.推广app成本太高; 2-3.开发的适配成本低; 2-4.容易⼩规模试错，然后快速迭代。 2-5.可以跨平台使用; 3.官网 3-1: 官网:https://mp.weixin.qq.com/ 3-2:微信者开发工具:https://mp.weixin.qq.com/wxamp/devprofile/get

轻松学会git(2)

starry__sty — Mon, 21 Jun 2021 17:21:02 +0800

6. reset命令三个参数对比 –sort 参数仅仅在本地库移动HEAD指针 –mixed参数在本地库移动移动HEAD指针重置暂存区 –hard参数在本地库移动HEAD指针重置暂存区重置工作区 7.删除文件并找回 7-1.删除文件: rm 文件名 7-2.找回: git add 文件名 git status 查看状态 git commit -m ‘文件描述’ 再重新提交一遍 7-3.前提:删除前,文件

一眼就懂,带你学会git(1)

starry__sty — Fri, 11 Jun 2021 15:47:41 +0800

Git命令行操作 git的整个流程: git add: 从工作区提交到暂存区 git commit -m ‘需要的名字’ 文件名字将暂存区提交到本地库 1.本地库初始化 1-1 :命令: git add: 从工作区提交到暂存区 git init 初始化一个git仓库 ll 检测有哪些目录 ls -lA 检测隐藏目录(以. 生成的目录是隐藏目录) cd 文件夹名进入那个文件夹 mkdir 文

基础小白学会安装Git

starry__sty — Thu, 10 Jun 2021 20:13:20 +0800

Git: 介绍:

webpack里的loader

starry__sty — Wed, 09 Jun 2021 15:57:29 +0800

Loaders 网址:https://webpack.js.org/loaders/ 1.作用:为了解决除了js类型的(txt,md 之类的) 2.代码示意loader: module:{ rules:[ { test:/\.txt$/, loader: 'raw-loader' //加载原始内容的loader } ], } 注意:webpack

介绍webpack

starry__sty — Tue, 08 Jun 2021 20:01:54 +0800

Wbpack 介绍: WebPack是什么? 他是一个使用node.js实现的一个模块化代码打包工具 ,可以将这些模块打包成一个或者多个包,是一个前端项目构建工具[打包器] 作用: 友好的模块化支持代码压缩混淆处理js兼容问题性能优化安装: webpack是基于node.js安装的,必须先安装nodel.js,再安装webPack. 安装前记得先初始化再安装: npm init -y npm install -D webpack webpack-cli 注意: 不推荐全局安装(全局安

webpack和模块化

starry__sty — Mon, 07 Jun 2021 20:06:06 +0800

模块化: 模块化是什么? 把复杂的问题分解成相对独立的模块; 作用: 模块化已经是现代前端开发不可或缺的一部分; 可以降低程序的复杂性,提高代码的复用性, 有利于团队协作开发与后期的维护与扩展模块化的核心独立的作用域如何导出模块内部数据如何导入外部模块数据独立的模块作用域一个文件就是模块，拥有独立的作用域，且导出的模块都自动处于严格模式下，即：'use strict' 模块中的变量 ,处于严格模式下导出模块内部数据使用export语句导出模块内部语句 //导出