react.js
MakeGreatEffort
这个作者很懒,什么都没留下…
展开
-
React.js--this.props.children
this.props对象的属性与组件的属性一一对应,但是有一个例外,就是this.props.children属性。它表示组件的所有子节点。var NotesList = React.createClass({ render: function(){ return( <ol> ...转载 2019-02-21 16:49:14 · 367 阅读 · 0 评论 -
React中key的必要性与使用
1.标签(常用)import { IndexRoute } from 'react-router'const Dashboard = React.createClass({ render() { return <div>Welcome to the app!</div> }})React.render(( <Router> ...转载 2019-03-13 10:40:37 · 526 阅读 · 0 评论 -
关于react-router的几种配置方式
路由的概念路由的作用就是将url和函数进行映射,在单页面应用中路由是必不可少的部分,路由配置就是一组指令,用来告诉router如何匹配url,以及对应的函数映射,即执行对应的代码。react-router每一门JS框架都会有自己定制的router框架,react-router就是react开发应用御用的路由框架,目前它的最新的官方版本为4.1.2。本文给大家介绍的是react-rout...转载 2019-03-13 10:22:38 · 1802 阅读 · 0 评论 -
React的几种路由配置方法
1.标签(常用)import { IndexRoute } from 'react-router'const Dashboard = React.createClass({ render() { return <div>Welcome to the app!</div> }})React.render(( <Router> ...转载 2019-03-13 10:21:20 · 3849 阅读 · 0 评论 -
JavaScript reduce() 方法
实例计算数组元素相加后的总和:var numbers = [65, 44, 12, 4]; function getSum(total, num) { return total + num; } function myFunction(item) { document.getElementById("demo").innerHTML = numbers.reduce(getSum); }...转载 2019-02-20 12:44:41 · 319 阅读 · 0 评论 -
JavaScript toFixed() 方法
JavaScript Number 对象实例把数字转换为字符串,结果的小数点后有指定位数的数字:var num = 5.56789;var n=num.toFixed(2);n 输出结果:5.57转载 2019-02-20 12:41:05 · 155 阅读 · 0 评论 -
JavaScript parseFloat() 函数
定义和用法parseFloat() 函数可解析一个字符串,并返回一个浮点数。该函数指定字符串中的首个字符是否是数字。如果是,则对字符串进行解析,直到到达数字的末端为止,然后以数字返回该数字,而不是作为字符串。语法parseFloat(string) 参数 描述 string 必需。要被解析的字符串。 浏览器支持所有主要浏览器都支持 pars...转载 2019-02-20 12:38:36 · 716 阅读 · 0 评论 -
react.js 中对props 的理解
-----------------开始---------------------1. 每个组件都是一个对象;2.props是对象的一个属性;3.组件对象可以通过props传递;----------------代码截图说明------------------------01. 代码//组件01function FancyBorder(props){ conso...转载 2019-02-20 11:52:36 · 2718 阅读 · 0 评论 -
componentDidMount()
componentDidMount()紧跟在组件装载后(被插入树中)调用。要求的DOM节点初始化应该放到这里。若你需要从远端加载数据,这是一个适合实例化网络请求的好地方。这个方法是建立任何订阅的一个好地方。如果你那么做了,别忘了在componentWillUnmount()取消订阅。在componentDidMount()中,你 可以立即调用setState()。它将会触发一次额外的渲染,...转载 2019-02-20 11:07:39 · 5805 阅读 · 0 评论 -
render()
render()render()render()方法是类组件唯一必须的方法。当被调用时,其应该检查this.props 和 this.state并返回以下类型之一:React元素。通常是由 JSX 创建。例如,<div /> 和 <MyComponent /> 是 React 元素,指示 React 渲染一个 DOM 节点,或是另一个用户定义的组件,各自...转载 2019-02-20 10:58:43 · 5410 阅读 · 0 评论 -
React入门介绍-ReactDOM.render()等基础
首先,React是一个用于构建用户界面的Javascript库,但Peact并不是一套完整的MVC或MVVM的框架,它仅涵盖V-view视图层。JSX是javascript的扩展,像Typescript,coffeeScript等一样,都是Javascript的语法糖,最终都要变编译成JS执行,建议使用JSX的代码进行React的开发。因为Javascript代码与JSX代码并不兼容,凡是使用JS...转载 2019-02-20 10:24:51 · 14339 阅读 · 0 评论 -
React-----学习笔记-----组件的render方法(四)
一个组件类必须要实现render方法,render方法必须要返回jsx元素,必须要用一个外层的 JSX元素把所有内容包裹起来。返回并列多个JSX元素是不合法的: 错误示例...render () { return ( <div>first</div> <div>second</div> )}...必须使用外层元素...转载 2019-02-19 12:23:11 · 377 阅读 · 0 评论 -
React props和state的主要区别
props和state的主要区别是props是不变的。 这就是为什么容器组件应该定义可以更新和更改的状态,而子组件只应该使用props来传递状态数据。使用props当我们在组件中需要不可变的数据时,可以在main.js中添加props到reactDOM.render()函数中,并在组件中使用它。文件:App.jsx -import React from 'react';cla...转载 2019-02-19 12:18:04 · 762 阅读 · 0 评论 -
理解React中es6方法创建组件的this
在JavaScript中,this对象是运行时基于函数的执行环境(也就是上下文)绑定的。从react中的demo说起Facebook最近一次更新react时,将es6中的class加入了组件的创建方式当中。Facebook也推荐组件创建使用通过定义一个继承自 React.Component 的class来定义一个组件类。官方的demo:class LikeButton extends...转载 2019-02-19 11:30:03 · 248 阅读 · 0 评论 -
React中import的用法
import defaultcomponent,{a,b,c...} from 'XXX'eg: import React,{Component} from 'react';导入‘react’文件里export的一个默认的组件,将其命名为React以及Component这个非默认组件import defaultcomponent form 'XXX'导入XXX文件中的默认组件,命名为def...转载 2019-02-19 11:00:49 · 3186 阅读 · 0 评论 -
在react项目中使用ECharts
这里我们要在自己搭建的react项目中使用ECharts,我们可以在ECharts官网上看到有一种方式是在 webpack 中使用 ECharts,我们需要的就是这种方法。 我们在使用ECharts之前要先安装ECharts,在以往的开发模式中,我们很多使用就是把官网中的ECharts的核心js文件导入到我们的html或者是jsp等文件里面,但是在react项目中,我们可以直接使用node....转载 2019-02-19 10:34:40 · 542 阅读 · 0 评论 -
es6的map()方法解释
map方法的作用不难理解,即“映射”,也就是原数组被“映射”成对应新数组。下面这个例子是数值项求平方:var data = [1, 2, 3, 4]; var arrayOfSquares = data.map(function (item) { return item * item;}); alert(arrayOfSquares); // 1, 4, 9, 16call...转载 2019-02-21 17:46:43 · 17518 阅读 · 2 评论 -
如何在react.js 中利用for循环之类的输出html
render() {return ( <div> {this.state.comments.map((comment) => (<Comment comment={comment} key={comment.id} /> ))} </div> ); }转载 2019-03-13 11:49:46 · 2586 阅读 · 0 评论