react
二字十一画与
技术小白的成长之路
展开
-
react简答题
1.简单描述一下箭头函数中的this指向,以及与普通函数中this的区别答案:箭头函数中的this 1.箭头函数没有自己的this, 它的this是继承而来; 默认指向在定义它时所处的对象(宿主对象),而不是执行时的对象, 定义它的时候,可能环境是window; 箭头函数可以方便地让我们在 setTimeout ,setInterval中方便的使用this 2.箭头函数中,this指向的固定化,并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数根本没有自己的this,导致内部原创 2020-06-19 10:53:46 · 234 阅读 · 0 评论 -
React之 条件渲染
以下所有内容摘自https://reactjs.bootcss.com/docs/conditional-rendering.html在 React 中,你可以创建不同的组件来封装各种你需要的行为。然后,依据应用的不同状态,你可以只渲染对应状态下的部分内容。React 中的条件渲染和 JavaScript 中的一样,使用 JavaScript 运算符 if 或者条件运算符去创建元素来表现当前的状态,然后让 React 根据它们来更新 UI。观察这两个组件:function UserGreeting(原创 2020-06-02 10:27:37 · 223 阅读 · 0 评论 -
React.Component (React class 组件的详细 API 参考)
本章节提供了 React class 组件的详细 API 参考。本章节默认你已熟悉基本的 React 概念,例如 组件 & Props,以及 State & 生命周期等。如果你还未熟悉,请先阅读之前章节进行学习。React 的组件可以定义为 class 或函数的形式。class 组件目前提供了更多的功能,这些功能将在此章节中详细介绍。如需定义 class 组件,需要继承 React.Component:class Welcome extends React.Component { r原创 2020-06-02 09:11:24 · 1048 阅读 · 0 评论 -
React之 事件处理
以下内容摘自:https://reactjs.bootcss.com/docs/handling-events.html1、React 元素的事件处理和 DOM 元素的很相似,但是有一点语法上的不同:2、使用 JSX 语法时你需要传入一个函数作为事件处理函数,而不是一个字符串。例如,传统的 HTML:<button onclick="activateLasers()"> Activate Lasers</button>在 React 中略微不同:<butto原创 2020-06-01 16:53:35 · 154 阅读 · 0 评论 -
React之 State & 生命周期
下列内容摘自:https://reactjs.bootcss.com/docs/state-and-lifecycle.html在元素渲染章节,有一个时钟的例子:function tick() { const element = ( <div> <h1>Hello, world!</h1> <h2>It is {new Date().toLocaleTimeString()}.</h2> </d原创 2020-06-01 15:31:46 · 185 阅读 · 0 评论 -
React之 组件&Props
组件允许你将 UI 拆分为独立可复用的代码片段,并对每个片段进行独立构思。组件,从概念上类似于 JavaScript 函数。它接受任意的入参(即 “props”),并返回用于描述页面展示内容的 React 元素。一、函数组件&class组件定义组件最简单的方式就是编写 JavaScript 函数:function Welcome(props) { return <h1>Hello, {props.name}</h1>;}该函数是一个有效的 React 组件,原创 2020-06-01 14:14:23 · 161 阅读 · 0 评论 -
React之元素渲染
以下内容摘自:https://reactjs.bootcss.com/docs/rendering-elements.html元素是构成 React 应用的最小砖块。元素描述了你在屏幕上想看到的内容。const element = <h1>Hello, world</h1>;与浏览器的 DOM 元素不同,React 元素是创建开销极小的普通对象。React DOM 会负责更新 DOM 来与 React 元素保持一致。注意:你可能会将元素与另一个被熟知的概念——“组件”混原创 2020-05-29 16:03:54 · 114 阅读 · 0 评论 -
React之JSX简介
以下内容摘自:https://reactjs.bootcss.com/docs/introducing-jsx.html考虑如下变量声明:const element = <h6>Hello World!</h6>这个有趣的标签语法既不是字符串也不是HTML。它被称为 JSX,是一个 JavaScript 的语法扩展。我们建议在 React 中配合使用 JSX,JSX可以很好的描述UI应该呈现出它应有的交互本质形式。JSX可能会使人联想到模板语言,但它具有JavaScrip原创 2020-05-29 15:42:54 · 128 阅读 · 0 评论 -
React是什么
React 是一个声明式,高效且灵活的用于构建用户界面的 JavaScript 库。使用 React 可以将一些简短、独立的代码片段组合成复杂的 UI 界面,这些代码片段被称作“组件”。React 中拥有多种不同类型的组件,我们先从 React.Component 的子类开始介绍:demo:class ShoppingList extends React.Component { render() { return ( <div className="shopping-li原创 2020-05-29 10:56:15 · 332 阅读 · 0 评论 -
React之const语句
以下内容都摘自:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/const常量是块级作用域,很像使用let语句定义的变量。常量的值不能通过重新赋值来改变,并且不能重新声明。一、democonst number = 42;try { number = 99;} catch (err) { console.log(err); // expected output: TypeErro原创 2020-05-29 10:37:42 · 5367 阅读 · 0 评论 -
React之let语句
以下内容都摘自https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/letlet语句声明一个块级作用域的本地变量,并且可选的将其初始化为一个值。一、demolet x = 1;if (x === 1) { let x = 2; console.log(x); // expected output: 2}console.log(x);// expected output: 1原创 2020-05-29 10:12:28 · 1585 阅读 · 0 评论 -
React之Hello World
ReactDOM.render( <h1>Hello, world!</h1>, document.getElementById('root'));原创 2020-05-28 11:30:08 · 159 阅读 · 0 评论 -
react前端学习常用命令
终端常用命令:cnpm installcnpm install rxjs-compatrimraf .\node_modulesnpm run start原创 2020-05-28 09:25:55 · 165 阅读 · 0 评论 -
箭头函数
以下内容摘自https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions箭头函数表达式的语法比函数表达式更简洁,并且没有自己的this,arguments,super或new.target。箭头函数表达式更适用于那些本来需要匿名函数的地方,并且它不能用作构造函数。引入箭头函数有两个方面的作用:更简短的函数并且不绑定this。var elements = [ 'Hydrogen'原创 2020-05-14 15:59:39 · 112 阅读 · 0 评论