最孤单的人
Github: https://github.com/imifeng
Android - Java/ Kotlin
展开
-
学习React第十七篇:使用React.cloneElement扩展子组件的功能
### 当需要扩展子组件的功能或属性的时候,可以利用React.cloneElement来创建具有扩展数据或功能的新组件(可以用来修改子组件属性值,复制子组件,添加子组件)。原创 2020-12-06 15:54:02 · 1225 阅读 · 0 评论 -
学习React第十六篇:了解React.Children实用程序
### 因为this.props.children 的值有三种可能:如果当前组件没有子节点,它就是 undefined ;如果有一个子节点,数据类型是 object ;如果有多个子节点,数据类型就是 array 。所以,处理 this.props.children 的时候要小心。React 提供一个工具方法 React.Children 来处理 this.props.children 。原创 2020-12-01 23:42:46 · 1094 阅读 · 0 评论 -
学习React第十五篇:构建一个JSX Live编译器作为React组件
### 我们将创建一个浏览器内JSX转译器,进一步的了解JSX从类似XML的语法转换为本地JavaScript。XML元素和属性分别转换为函数调用和对象。(其实就是Html转为React.createElement)原创 2020-11-26 21:59:01 · 322 阅读 · 0 评论 -
学习React第十四篇:使用高阶组件组合React组件行为
### 高阶组件(HOC)是 React 中用于复用组件逻辑的一种高级技巧。HOC 自身不是 React API 的一部分,它是一种基于 React 的组合特性而形成的设计模式。具体而言,高阶组件是参数为组件,返回值为新组件的函数。原创 2020-11-17 21:46:56 · 231 阅读 · 0 评论 -
学习React第十三篇:使用映射从数据数组创建React组件
### React组件可以基于数据集动态生成。本课将向您展示如何通过映射state.data对象来完成此操作。原创 2020-11-12 08:42:59 · 737 阅读 · 0 评论 -
学习React第十二篇:收到新的Props时控制React组件更新(shouldComponentUpdate)
### React组件生命周期将允许您在运行时更新组件。 这里将探讨如何做到这一点。 componentWillReceiveProps让我们有机会通过在进行render()调用之前对prop过渡做出反应来更新状态。 shouldComponentUpdate允许我们设置何时更新组件的条件,以使我们不会不断渲染。 componentDidUpdate让我们对组件更新做出反应。原创 2020-11-11 16:46:46 · 1045 阅读 · 0 评论 -
学习React 箭头函数篇
### 对于React中函数写法,看到了有这样的写法:update = () => { ... } ,有点奇怪。原创 2020-11-10 20:54:09 · 1477 阅读 · 0 评论 -
学习React第十一篇:使用生命周期方法管理React组件状态
### 在本篇中,将学习关于React组件生命周期的一些简单用法,以及我们如何与状态进行交互。** componentWillMount已经是旧版生命周期方法,虽然仍然有效,但我们建议使用constructor()代替初始化状态。原创 2020-11-10 20:36:48 · 212 阅读 · 0 评论 -
学习React第十篇:了解React组件生命周期方法
### React组件具有生命周期,可以访问该生命周期的特定阶段。 本课概述了整个组件的生命周期,并演示了React组件的安装和卸载。原创 2020-11-06 16:32:46 · 166 阅读 · 0 评论 -
学习React第九篇:使用React ref获取对特定组件的引用
### 使用React组件时,您需要能够访问对单个组件实例的特定引用。这是通过定义引用来完成的。本课将向我们介绍使用ref时的一些细微差别。原创 2020-11-05 19:45:03 · 442 阅读 · 0 评论 -
学习React第八篇:使用Reacts综合事件系统规范化事件
将自定义propType验证添加到React组件:https://blog.csdn.net/qq_20613731/article/details/109345876###事件处理程序在React中传递给SyntheticEvent实例。 在本课程中,我们将介绍可供我们使用的各种事件,包括触摸事件。React Synthetic Event System,它规范了我们可能希望在各种浏览器中使用的所有事件:1.设置一个简单的文本区域;2.添加H1的内容将显示:this.state.cur.原创 2020-11-03 21:38:45 · 250 阅读 · 0 评论 -
学习React第七篇:将自定义propType验证添加到React组件
继编写使用Reacts props.children访问嵌套数据除了React.propTypes中内置的类型之外,我们还可以定义自己的自定义propType验证器在此示例中,我们的标题组件期望文本道具在使用时不会传递。我们为组件提供了一个PropTypes设置,它期望文本prop是字符串的PropType。可以在IsRequired上进行标记,以使我们的组件抛出未提供prop的错误,但这大约是我们可以实现的内置验证的程度。如果我们想进一步验证,我们可以返回一个自定义函数,而不是返回React..原创 2020-10-28 22:09:54 · 646 阅读 · 0 评论 -
学习React第六篇:使用Reacts props.children访问嵌套数据
继编写将React组件用作其他组件的子组件在构建React组件时,您可能需要访问标记的子属性。 this.props.children访问innerHTML或另一个组件的嵌套组件。为了访问组件中的嵌套值或组件,可以使用props.children:示例文件 State.js:import React from 'react'class PropsChildren extends React.Component { render() { return ( .原创 2020-10-27 21:22:11 · 637 阅读 · 0 评论 -
学习React第五篇:将React组件用作其他组件的子组件
继编写使用setState管理React组件状态owner-ownee的关系用于指定与React组件的父子关系,因为它不同于DOM关系。本篇演示了使用无状态函数显示数据时React的可组合性。React的重要特征是React组件可以输出或渲染其他React组件。这里有一个非常简单的组件。示例文件 State.js:import React from 'react'class State extends React.Component { //为了让我们开始使用状态,我将在这里.原创 2020-10-27 09:06:34 · 261 阅读 · 0 评论 -
学习React第四篇:使用setState管理React组件状态
继编写在React组件上设置属性(PropTypes)与props不同,props是要作为静态值传递到我们的组件中的值的集合,而并非要被我们的组件更改。状态表示将要管理的值的集合,并由我们的组件更新。接下来,使用setState管理React组件状态:示例文件 State.jsimport React from 'react'class State extends React.Component { //为了让我们开始使用状态,我将在这里设置一个构造函数方法 con..原创 2020-10-26 17:21:23 · 232 阅读 · 0 评论 -
学习React第三篇:在React组件上设置属性(PropTypes)
继编写使用组件的render方法在React中显示输出接下来,在React组件上设置属性:import React from 'react';import PropTypes from 'prop-types';class App extends React.Component { render() { let txt = this.props.txt return <h1>{txt}</h1> }}App.propTypes =..原创 2020-10-24 14:04:53 · 1241 阅读 · 0 评论 -
学习React第二篇:使用组件的render方法在React中显示输出
继 编写第一个“ Hello World” React组件编写使用组件的render方法在React中显示输出:import React from 'react';class App extends React.Component { render() { return ( <div> <h1>Hello World</h1> <b>Bold</b> </div原创 2020-10-24 12:37:06 · 847 阅读 · 0 评论 -
学习React第一篇:编写一个“ Hello World” React组件
在安装开发环境 / 创建应用 / 并在VS Code中查看你自己创建的应用程序后,开始编写第一个“ Hello World” React组件:import React from 'react';class App extends React.Component { render() { // return React.createElement('hi', null, "Hello World") return <h1>Hello World</h1&..原创 2020-10-24 12:16:48 · 283 阅读 · 0 评论