- 博客(27)
- 收藏
- 关注
RSS订阅翻译 React高级指引：与第三方库协同
上一节：高阶组件下一节：深入JSXReact高级指引：与第三方库协同引言集成带有DOM操作的插件如何解决这个问题集成jQuery Chosen插件与其他视图库整合使用React替换基于字符串的渲染把React嵌入到Backbone视图和Model层集成在React组件中使用Backbone的Model从Backbone的Model中提取数据引言React可以在任何web应用中使用。它可以与...
2019-11-09 14:21:11
540
翻译 React高级指引：高阶组件
上一节：Fragments下一节：与第三方库协同React高级指引7：高阶组件引言使用高阶组件解决横切关注点问题不要修改原始组件，使用组合约定：将不想管的props传递给被包裹的组件约定：最大化可组合性约定：包裹显示名称一遍轻松调试注意事项不要在render方法中使用高阶组件务必复制静态方法Refs不会被透传引言在React中高阶组件(HOC)是用于复用组件逻辑的一种高阶技巧。高阶组件自身...
2019-11-06 19:14:12
447
翻译 React高级指引：Fragments
上一节：Refs转发下一节：高阶组件React高级指引：Fragments引言动机引言React一个常用的模式是组件返回多个元素。Fragment可以为你的子元素分组而不需要在DOM上为它们添加额外的节点。render() { return ( <React.Fragment> <ChildA /> <ChildB /&g...
2019-10-30 10:45:55
335
1
翻译 React高级指引：Refs转发
上一节：异常捕获边界下一节：FragmentsReact高级指引：Refs转发引言将refs转发给DOM组件组件库维护者的注意事项在高阶组件中转发refs在DevTools中显式自定义名称引言Ref转发是一项自动从组件中将ref传递给其子组件的技术。但这在绝大部分组件中不是必需的。但是这对某些组件来说会非常有用，尤其是在某些可复用的第三方组件库中。常见的场景我们将在下面的内容描述。将re...
2019-10-29 15:33:48
452
翻译 React高级指引：异常捕获边界(Error Boundaries)
上一节：Context下一节：Refs转发异常捕获边界引言异常捕获边界(Error Boundaries)异常捕获边界的放置位置未捕获异常的新行为组件栈追踪关于try/catch？关于事件处理器自React15的命名更改引言过去，组件内出现JavaScript异常时会导致React内部的state被破坏并且在下一次渲染时抛出 可能无法跟踪的 异常。这些错误基本上都是有早期代码（非React...
2019-10-28 15:46:08
643
翻译 React高级指引：Context
context提供了一种数据传输方式，它使得数据可以直接通过组件树传递而不需要在每一个层级上手动地传递props。
2019-10-27 14:26:30
309
翻译 React高级指引：无障碍
无障碍为什么要使用无障碍辅助功能标准和指南WCAGWAI-ARIA语义化的HTML上一节：以React的方式思考下一节：代码分割为什么要使用无障碍辅助功能网络无障碍辅助功能（也成为a11y）能够被任何人使用的网站功能。无障碍辅助功能是允许辅助性技术解释网站所必需的。React通过使用标准HTML技术支持构建无障碍辅助网站。标准和指南WCAG网络内容无障碍指南( Web Conten...
2019-10-23 17:55:05
1450
翻译 React核心概念：以React的方式思考
以React的方式思考引言从设计稿开始步骤1：根据UI划分组件层次步骤2：用React创建一个静态版本补充说明：props和state步骤3：确定UI状态的最小完备集步骤4：确定state放置的位置步骤5：添加反向数据流引言在我们看来React是构建大型快速反应的Web应用的首选方式。我们已经在Facebook和Instagram里面证实了React能够运行地非常完美。React最棒的部分之...
2019-10-19 15:52:05
296
翻译 React核心概念：组合vs继承
组合vs继承引言包含关系特例关系那么继承呢？上一节：状态提升下一节：以React的方式思考引言React拥有功能强大的组合模式，我们推荐使用组合而非继承来实现代码的复用。在本章中，我们将要讨论几个React新手经常会遇到的关于继承的问题并展示我们如何使用组合解决它们。包含关系某些组件不能预先知道它的子元素是怎样的，这对于类似于SideBar或Dialog这类容器组件来说是十分常见的。...
2019-10-17 17:17:09
434
翻译 React核心概念：状态提升
状态提升引言引言很多情况下我们使用的多个组件需要对同一个数据做出对应的反应。在这里我们推荐把这个共享的状态提升到距离这些组件最近的祖先组件。现在让我们来看看这是怎么工作的。在本章中，我们将会创建一个温度计算器来计算在给定温度下水是否会沸腾。首先我们现创建一个BoilingVerdict组件。它接收一个celsius（摄氏度）作为prop，并在页面上打印出在这个温度下水是否会沸腾。func...
2019-10-17 15:56:45
327
翻译 React核心概念：表单
表单引言受控组件textarea标签select 标签文件输入标签处理多个输入受控输入空值受控组件的替代品成熟的解决方法上一节：列表&keys下一节：状态提升引言React中表单元素与其他元素的有些不同，因为表单元素本身就是带有状态的。现在让我们来看看下面这段代码：<form> <label> Name: <input type=...
2019-10-16 17:56:49
217
翻译 React核心概念：列表&keys
列表&keys引言渲染多个组件基础列表组件keys用key提取组件Keys在兄弟节点之间必须是唯一的在JSX中嵌入map()上一节：条件渲染下一节：表单引言首先让我们来回顾以下怎么在JavaScript中转换列表。在下面的代码中，我们使用map()函数让数组中的每一个数字乘2。在这之后我们将通过map()返回的新数组赋值给doubled并将其打印出来：const numbers...
2019-10-16 15:59:02
191
翻译 React核心概念：条件渲染
条件渲染引言元素变量逻辑&&三目运算符阻止组件渲染引言在React中你可以创建封装有不同行为的组件，并且根据应用的状态渲染其中的某些组件。React中的条件渲染与JavaScript一致。使用JavaScript运算符（如if或条件运算符）来创建代表当前状态的元素，之后让React更新UI以匹配它们。我们来看下面两个组件：function UserGreeting(p...
2019-10-16 10:53:22
219
翻译 React核心概念：事件处理
事件处理事件处理函数向事件处理函数传递参数上一节：state&生命周期下一节：条件渲染事件处理函数处理React元素的事件与处理DOM元素上的事件十分相似，它们仅有一些语法上的区别。React事件名采用小驼峰命名规则而不是纯小写使用JSX需要传入函数作为事件处理函数而不是传入字符串例如，在HTML上 <button onclick="activateLasers(...
2019-10-15 15:13:02
217
翻译 React核心概念：state&生命周期
state&生命周期引言将函数组件转化为class组件向class组件中添加局部state向class中添加生命周期方法本节内容介绍React组件中关于状态（state）及生命周期的概念引言我们来看看上节中编写的计时器。目前我们只学习了一种方式来更新UI，那就是调用ReactDOM.render()来改变渲染输出。function tick() { const elemen...
2019-10-15 11:26:18
254
翻译 React核心概念：组件&Props
上一节：渲染元素下一节：状态&生命周期组件和props组件将UI划分成独立的，可复用的片段，并对每个组件进行独立的构思。本节将会介绍组件的构建思路。概念上来说，组件就好像是JavaScript里的函数。它们能够接受任意的入参（称作props）并返回描述屏幕展示UI的React元素。函数组件&类组件定义组件最简单的方法就是写一个JavaScript函数。functi...
2019-09-30 11:37:12
272
翻译 React核心概念：渲染元素
渲染元素元素是React App中最小的构建块元素描述了你在屏幕上看到的图形界面const element = <h1>Hello, world</h1>;不想浏览器的DOM元素，React元素是便于构建的普通对象。React DOM负责更新DOM以匹配React元素。提示：有人可能会把React元素和更广为人知的组件混淆，但要注意的是组件是由元素构成的。组...
2019-09-29 17:29:19
205
原创 配置基础mybatis过程
本文记录配置基础的mybatis组件过程1.代码结构配置mybatis所需要的文件如图所示2. 构建log日志创建log4j.properties，代码如下log4j.rootLogger=DEBUG , stdoutlog4j.logger.org.mybatis=DEBUGlog4j.appender.stdout=org.apache.log4j.ConsoleAppen...
2019-09-17 10:14:50
137
原创 IDEA加载不到xml文件
在使用mybatis时遇到找不到xml文件的错误Cause: org.apache.ibatis.builder.BuilderException: Error parsing SQL Mapper Configuration. Cause: java.io.IOException: Could not find resource mapper/RoleMapper.xml at org.ap...
2019-09-13 20:54:45
1141
原创 使用CGLIB动态代理时遇到的与asm冲突问题
使用CGLIB进行动态代理时报了如下错误Exception in thread "main" java.lang.ExceptionInInitializerError at common.proxy.CglibProxyExample.getProxy(CglibProxyExample.java:18) at test.main(test.java:12)Caused by: java...
2019-09-10 19:51:13
1052
原创 安卓快速集成极光推送
由于网上大部分集成文章有错误，且官方文档写的不够详细。因此笔者在此处记录一下自己集成极光推送的过程。创建应用登录官网后进入开发者平台点击创建应用输入应用名称此处应用名称必填，图片上传可选创建完成后可以看到我们创建应用的AppKey点击下方的推送设置，设置应用包名设置完成之后下载demo，集成极光推送需要用到demo中的代码。集成推送1.添加jcenter库在pro...
2019-09-09 18:35:18
423
原创 AccessibilityEvent常用详解
AccessibilityEvent常用详解本文是作者在使用android的AccessibilityService时记录使用到的AccessibilityEvent的一些情况，如有错误欢迎指正（dinjet@foxmail.com）屏幕状态改变事件AccessibilityEvent.TYPE_WINDOW_STATE_CHANGED在不同app之间切换时触发，在同一app内进入不...
2019-09-03 17:21:52
3407
1
翻译 React核心概念：JSX简介
JSX简介为什么要使用JSX在JSX嵌入表达式JSX也是表达式为JSX指定属性为JSX指定子元素JSX其实是对象首先我们先来看下下面这个变量的声明const element=<h1>Hello World!</h1>这个有趣的愈发既不是一个字符串也不是一个HTML标签。这种语法被称为JSX，是Javascript的一种扩展语法。我们推荐在React中使用JSX去编...
2019-07-29 13:52:52
282
翻译 React安装：创建React应用
创建react应用使用react工具链的好处推荐的工具链Create React AppNext.jsGatsby更灵活的工具链从零开始打造工具链（本文根据react官网翻译，并加入了部分个人想法，如有遗漏请联系作者）使用react工具链的好处扩展文件和组件的范围使用npm集成第三方库自动检测语法错误实时编写CSS和Javascript优化生成输出提示：本章所推荐的工具链不需...
2019-07-14 21:44:13
222
翻译 React安装：在现有项目上使用React
在现有项目上使用react简单介绍即添即用1.在html中添加DOM容器2.添加script标签3.创建react组件4.搞定了使用JSX1.简单地使用JSX2.在项目中使用JSX3.运行JSX预处理器简单介绍react是希望被大众逐步接受为初衷所设计的框架，因此你可以在项目中按照需求来使用react，即使知识添加一些零星的交互也是可行的。大部分的网站项目都不是一个单一页面的应用，你可以在项...
2019-07-12 08:55:25
957
原创 JMeter初次使用记录
**JMeter初次使用记录**最近写了一个小网站，想来测试一下在高并发下的数据写入时会不会有数据丢失问题发送。（因为原理没学好，所已就像测试一下来验证自己写的对不对）由于笔者的专业知识还不够扎实，文章中难免出现错误，还请读者海涵，指出。所以就找了JMeter来测试（原本享用Locust的，奈何对python并不熟悉）首先是安装JMeter，这个大部分网上都是有的，所以就看这个就好了，h...
2018-10-15 01:16:45
317
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人