- 博客(39)
- 资源 (1)
- 收藏
- 关注
原创 可以正常上网但系统显示无网络连接,微软系服务提示0x800704cf,0x800713AB
可以正常上网但系统显示无网络连接,微软系服务提示0x800704cf,0x800713AB
2023-03-14 11:14:46
3908
2
原创 Eslint配置
Eslint配置1. 基础规则配置{ "rules": { "semi": ["error", "always"], "quotes": ["error", "doublbe"] }}规则semi的第一个值可选值为:"off" or 0 关闭规则"warn" or 1 警告"error" or 2 报错2. 配置继承规则{ "extends": "eslint:recommended"}3. ESlint配置配置Eslint规则的两种方式:通过
2021-11-09 17:40:15
986
原创 Vue SPA SEO
Vue SPA’s SEO未开发且需要SSR的项目可选择使用Nuxt.js已开发好的SPA可使用prerender-spa-plugin与vue-meta-info(改动最小)参考博客:这个那个
2021-11-09 09:47:13
645
原创 ADB通过WLAN连接到Android设备
ADB通过WLAN连接到Android设备(Android10及更低版本)首先使用USB连上ADB(即确保USB连接情况下, abd devices能正确显示设备)adb tcpip 5555让设备监听5555端口上的TCPIP连接拔掉设备的USB线, 不拔也可以adb connect phone_ip:5555 通过IP地址连接到设备adb disconnect phone_ip:5555 断开连接USB拔线后adb devices显示设备offline在拔掉数据线后
2021-10-28 14:20:28
1228
原创 理解原型对象
理解原型对象1. prototype一个函数一旦创建,就会根据特定的规则为其创建一个prototype属性(指针),指向函数的原型对象。该原型对象在创建时自动获得一个constructor属性,该constructor指向prototype所在函数。即:Person.prototype.constructor === PersonPerson.prototype = { constructor: Person // 自动生成的 prototype样子}2. __proto__当调用构造函
2021-06-07 18:09:19
224
原创 创建对象的几种模式
对象字面量的方式不能量产“同类”对象。1. 工厂模式function createPerson(name, age, job) { var o = new Object() o.name = name o.age = age o.job = job o.printName = function() { console.log(this.name); } return o}var person1 = createPerson('Richard', 21, 'Eng
2021-06-07 17:00:00
180
原创 CSP内容安全策略
CSPCSP介绍使用方法维基百科可抵御威胁XSS跨站脚本攻击CSP 的主要目标是减少和报告 XSS 攻击 ,XSS 攻击利用了浏览器对于从服务器所获取的内容的信任。恶意脚本在受害者的浏览器中得以运行,因为浏览器信任其内容来源,即使有的时候这些脚本并非来自于它本该来的地方。CSP通过指定有效域——即浏览器认可的可执行脚本的有效来源——使服务器管理者有能力减少或消除XSS攻击所依赖的载体。一个CSP兼容的浏览器将会仅执行从白名单域获取到的脚本文件,忽略所有的其他脚本 (包括内联脚本和HTM
2021-01-04 17:09:40
273
1
原创 auth
常见的认证方案1. HTTP Auth Authentication这是HTTP提供的一个用于权限控制和认证的通用框架,其中最常用的HTTP认证方案就是HTTP Basic Authentication[ 鉴权流程 ]客户端发送一需要权限验证的请求,服务端返回未授权,需要授权。客户端发送带有认证信息的请求,服务端验证并返回结果。[ 加解密过程 ]// 加密过程let email = 'demo@test.com'let password = '1234455'let auth = `${
2020-11-07 17:09:35
696
原创 06 Fragments
FragmentsFragments可以理解成:多个片段,多个部分(React元素返回的Fragments)在此之前,我们开发的组件 return 的都是单个React元素,想要返回多个元素就必须使用父元素包裹这些子元素,然后返回这个父元素。然而,这并不总是能满足要求的,例如在下述场景中,嵌套div将导致表格不能正常渲染class Table extends React.Component { render() { return ( <table>
2020-11-05 15:05:27
143
原创 04 Error Boundaries
错误边界为什么需要?在React16之前,组件内的JavaScript错误会导致React的内部状态被破坏,并且在下一次渲染时产生无法追踪的错误。这些错误基本上是由其他的非React组件代码错误引起的。但React并没有提供一种优雅的错误处理,也无法从错误中恢复。部分UI的JS错误不应该导致整个应用的崩溃,为了解决这个问题,React引入了一个新的概念——错误边界。错误边界是一种React组件,这种组件可以捕获并打印发生在其子组件数任何位置的JS错误,然后,渲染出备用UI,而非崩溃了的子组件。错误边
2020-11-04 15:21:52
179
原创 03 Context
简要介绍在典型的React应用中,数据是通过props属性自上而下(由父及子)进行传递的但这种做法对于类似地区偏好,UI主题等全局共享的属性而言是极其繁琐的,这类属性在应用中会被许多组件使用Context提供了一种在组件之间共享此类值的方式,而无需逐层传递props何时使用Context的设计目的是为了共享那些对于一个组件树而言是“全局”的数据,例如当前认证的用户、主体或者首选语言// Class组件使用Contextconst ThemeContext = React.createCont
2020-11-04 14:03:48
96
原创 02 Code-Splitting
打包大多数React应用都会使用Webpack/Rollup/Browserify这类构建工具来打包文件打包指的是将引入文件合并到一个单独文件的过程,最终形成一个bundle,接着在页面内引入该bundle,就可以一次性载入!如果你在使用 Create React App, Next.js, Gatsby等类似工具,你会拥有一个可以直接使用的Webpack配置来进行打包工作。如果没有使用上述工具,就需要自己进行配置代码分隔尽管打包是个很棒的技术,但随着应用的增长和第三方库的增加,难免会出现页面
2020-11-04 14:02:44
126
原创 12 Thinking in React
Steps to think in React1. 根据UI划分组件层级AppSearchBarProductTableCategoryRowProductRow2. 用React创建一个静态版本(渲染UI)建议:渲染UI和添加交互过程分开通过props传入所需数据, 不推荐使用state构建静态版本state代表了随时间变化而变化的数据, 应当仅在实现交互时使用大型项目自下而上开发, 小型项目自上而下开发(先父后子)3. 确定UI state的最小完整表示(
2020-11-02 14:42:24
106
原创 11 Component Composition
组件组合React有着十分强大的组合模式, 用以实现组件间代码的重用组件间关系决定着组件之前的组合关系包含关系对于例如侧边栏(Sidebar), 对话框(Dialog)这种通用容器来说,我们无法提前知晓其子组件的具体内容1. 使用特殊的prop: children prop来把子组件传递到渲染结果中去。function Sidebar(props) { return ( <div style={{color: props.color}}> {props.chi
2020-10-31 14:39:04
486
原创 10 Lifting State up
状态提升lifting child’s local state up to its parent’s local state当组件A与组件B共同使用相同数据, 数据存储在A与B的state中时可以将共用数据放到其最近的父元素C的state中去, 让C通过props传递给A与B这样, C的state是A与B的唯一数据源, 就保证了数据的一致性示例程序(温度转换)见: myapp>Calculator...
2020-10-30 15:40:30
206
1
原创 09 Forms
受控组件什么是受控组件与非受控组件?Controlled components & Uncontrolled components非受控组件:HTML原生表单元素, 例如input, textarea, select等受控组件React组件内部state成为表单组件的唯一数据源组件控制着/处理用户操作(即管理事件处理)被React以这种方式控制取值的表单输入元素称为"受控组件";与Vue中data作为表单元素唯一数据源、methods处理用户事件是类似的选择受控组件与否的建议:
2020-10-30 14:29:29
194
2
原创 08 Lists and Keys
Array.map()函数const numbers = [1, 2, 3, 4, 5]const doubled = numbers.map(number => number *2)同样地,通过数组的map函数将数组转换成React元素列表1. 组件中渲染列表function NumberList(props) { const numbers = props.numbers const items = numbers.map(number => { <li
2020-10-30 14:28:54
94
原创 07 Conditional Rendering
条件渲染:根据条件渲染不同组件/组件不同元素1. iffunction Usergreeting(props) { return <h1>Welcome back!</h1>}function Guestgreeting(props) { return <h1>Please sign in.</h1>}function Greeting(props) { const isLoggedIn = props.isLoggedIn if
2020-10-30 14:28:22
98
原创 06 Handling Events
1. 事件处理的不同点React事件的命名采用小驼峰camelCase方式,而非纯小写使用JSX语法时传入函数作为时间处理函数,而非字符串<!-- HTML --><button onclick="activateLasers()"> Activate Lasers</button><!-- REACT --><button onClick={activateLasers}> Activate Lasers</bu
2020-10-30 14:27:18
83
原创 05 Component State
1. 使用State更新渲染DOM03 React element 更新渲染一节中提到通过设置定时器重复调用ReactDOM.redner()渲染是不推荐的做法本节将通过State编写有状态的组件完成之前效果class Clock extends React.Component { constructor(props) { super(props) this.state = {date: new Date()} } componentDidMount() {
2020-10-30 09:37:52
88
原创 04 Component & Props
1. 组件定义组件将UI拆分成多个独立可复用的代码片段概念上类似于JS函数,接收任意入参(props),返回React元素2. 组件类型函数组件function Welcome(props) { return <h1> Hello, {props.name} </h1>;}class组件class Welcome extends React.Component { render() { return <h1>Hello, {this.
2020-10-30 09:37:27
278
原创 03 React Element
1. React元素与DOM元素React元素是构成React应用的最小砖块React元素是开销极小的普通对象React组件是由React元素构成的React DOM负责更新DOM来与React元素保持一致2. React元素渲染成DOM元素<div id="root"></div>称上述div节点为根DOM节点,因为该节点内所有内容都将由React DOM管理要将React元素/组件渲染到根DOM节点中,只需要将其传入ReactDOM.render()co
2020-10-30 09:36:33
92
原创 02 JSX Intro
什么是JSX?JSX is short for Javascript Extension, similar to JSP in the follwing ways…JSP页面允许你在HTML页面通过<% %>写Java代码JSX页面允许你在HTML标签内通过{ }写JS代码为什么要使用JSX?怎样使用JSX?在JSX中嵌入变量const name = 'Josh Perez';const element = <h1>Hello, {name}</h1>
2020-10-30 09:36:05
88
原创 01 Concept
React是什么React是一个声明式的用于构建用UI的JavaScript库React特点声明式:命令式?组件化一次学习 随处编写怎样学习入门边学边做:实践教程概念学习:教程文档创建demo的方式CDN方式引入unpkg的包使用集成的工具链推荐的工具链学习/创建一个新的SPA时:使用 Create React App在用Node.js构建SSR网站时:试试Next.js在构建面向内容的静态网站时:试试Gatsby打造组件库/将React集成到现有代码仓库:尝试
2020-10-30 09:35:23
87
原创 common ways to iterate through array
遍历数组的几种方法forconst arr = [1, 2, 3, 4, 5]for(let i = 0; i < arr.length; i++) { console.log(i, arr[i])}for-in// 数组for(let index in arr) { console.log(i, arr[i])}// emumerable objconst obj = { a:1, b:2, c:3, d: 'hello'}for(let prop in obj)
2020-10-29 20:46:45
84
原创 Ubuntu无法进入图形化界面 Oh no! system can not recover please logout and try later
场景:Ubuntu更换桌面背景图片,添加使用百度下载某一图片时(文件大小>1M)系统崩溃 无法进入桌面系统提示:oh no! ...system cant recover...please logout and try latter(差不多这个意思 没截图)原因猜测:可能是因为图片太大了系统提示 已经把这个问题发送给Ubuntu了解决办法:#1. logout后,Ctl+Alt+F2(/F3/F4/F5/F6)进入CLI界面,登录后对图形化界面软件进行修复(Ctl+
2020-10-09 17:16:04
4154
原创 第5章 HTTP Web服务器
1. 虚拟主机实现多域名HTTP/1.1规范允许一台HTTP服务器搭建多个Web站点,因此,即使物理层面上只有一台服务器,只要使用虚拟主机的功能,则可以假想已具有多台服务器问:单主机多域名的话,客户端访问不同域名时,DNS返回的都是该物理服务器主机IP,此时服务器怎样判断访问哪个域名/资源?答:没错,由于虚拟主机可以寄存多个不同主机名和域名的Web网站,因此在发送HTTP请求时,必须要在Host首部完整地指定主机名或者域名的URI。2. 通信数据转发程序在进行HTTP通信时,除了客户端和
2020-09-24 15:22:29
122
原创 第2章 HTTP协议基础
请求/相应 报文组成请求报文 由 请求方法(Methods)、请求URI(request-URI)、协议版本、可选的请求首部字段(Headers) 和 内容实体 组成响应报文 由 协议版本、状态码(status code)、原因短语(reason-phrase)、可选的首部字段(Header field) 和 资源实体的主体(entity body) 组成HTTP是无状态的协议(Stateless)HTTP协议自身并不对请求和响应之间的通信状态进行保存,也就是说HTTP协议对于发送过的请求或
2020-09-21 21:04:00
111
原创 第1章 了解Web及网络基础
http诞生CERN(欧洲核子研究组织)的Tim Berners Lee提出了让远隔两地的研究者们共享知识的设想最初设想的基本理念:借助多文档之前相互关联形成的超文本(HyperText),连接成可相互参阅的万维网(WWW)构建WWW万维网的三项技术: HTML + HTTP + URLWeb成长1993年1月,现代浏览器祖先Mosaic问世 研发自NCSA(National Center for Supercomputer Applications)1994年12月,网景通信公司发
2020-09-21 15:16:25
103
原创 配置.gitignore文件 忽略node_modules文件夹更改
1. 问题描述在使用npm install时给项目添加新依赖时Git status/ VS Code显示几十条甚至上百条更改就是因为没有设置.gitignore文件来忽略node_modules文件夹的更改2. 解决办法1. 在项目根目录添加.gitignore文件 Git bash: touch .gitignore 或者直接在根目录下手动新建该文件2. 在.gitignore文件中添加如下行 node_modules/3. 常用配置.
2020-09-18 16:50:22
4225
原创 Git warning: LF will be replaced by CRLF in XXX
1. 问题描述waring: xxx2. 概念简介3. 出现原因4. 解决方法5. 问题总结
2020-08-30 22:30:42
195
原创 Centos配置SVN服务器 (Setup SVN Server in Aliyun Centos)
1. 操作步骤yum -y install subversionmkdir /svnrepossvnadmin create /svnrepos/testcd /svnrepos/test/confvi passwdvi authzvi svnserve.conffirewall-cmd --permanent --add-port=3690/tcpfirewall-cmd --reloadsvnserve -d -r /svnrepossvn://yourip
2020-08-29 16:07:02
981
IBM-PC汇编语言程序设计(第二版)-学习札记.pdf
2019-06-21
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人