![](https://img-blog.csdnimg.cn/20190903094752380.jpg?x-oss-process=image/resize,m_fixed,h_224,w_224)
React+dva
菜鸟搬砖记
世上无难事,只要肯放弃。。。
展开
-
初识React(1):dva+antd创建react项目
用dva创建项目,首先要全局安装dva-clicnpm install dva-cli -g创建一个项目dva new 项目文件名称项目创建完毕,进入项目目录下,安装ant-design这个ui框架cnpm install antd --save在项目目录下,安装antd按需加载插件,如下:cnpm install babel-plugin-import...原创 2018-08-29 16:34:03 · 712 阅读 · 2 评论 -
初识React(2):什么是JSX?
前言在react中,我们的页面内容就是通过JSX来编写,那么JSX到底是什么呢?JSX其实就是JavaScript对象,会构建创建一个js对象来描述HTML结构的信息。这里要记住JSX是js的一种扩展语言,类似HTML但是又不是HTML,因为JSX中还能进行运算,判断,加入一些js语言等。JSX中的运算 render() { return( &l...原创 2018-08-29 16:35:15 · 216 阅读 · 0 评论 -
初识React(3):组件
创建组件创建组件之前要注意以下几点: 1. 组件创建的名称首字母得大写 2. 组件中返回的JSX只能是一个根节点,所有的内容得用一个元素都框起来1.无状态函数式组件无状态函数式组件可以理解成就是一个函数生成的,使得代码的可读性更好,并且精简、便利,减少了冗余,无状态组件有以下特点: 1. 组件无法被实例化,整体渲染提高 2. 组件不能访问this对象,因为没有实例化,所以无...原创 2018-08-29 16:36:15 · 127 阅读 · 0 评论 -
初识React(4):ref属性
ref属性其实就是为了获取DOM节点,例如:import React from 'react'class RefComponent extends React.Component { componentDidMount(){ this.inputNode.focus(); } render() { return ( <div>...原创 2018-08-29 16:36:47 · 910 阅读 · 0 评论 -
初识React(5):dangerouslySetInnerHTML属性
dangerouslySetInnerHTML属性的功能实际上就是显示纯文本内容import React from 'react';class SetHtml extends React.Component { constructor(){ super(); this.state = { content:'<h1>标题名称</h1>...原创 2018-08-29 16:37:17 · 1316 阅读 · 0 评论 -
初识React(6):propTypes类型检测
propTypes是react中用来对参数进行类型检测的,当然要使用这个插件,得先安装这个插件,如下:npm install prop-types --save 但是如果你是直接用dva创建的项目,无需安装,直接引入即可,如下:import React from 'react';import PropTypes from 'prop-types';class PropTy...原创 2018-08-29 16:37:42 · 855 阅读 · 0 评论 -
初识React(7):高阶组件
什么是高阶组件高阶组件,听着好像很高大尚,但是其实高阶组件就是一个函数的参数是组件,返回的是一个新的组件。那么,高阶组件有什么好处呢,高阶组件可以减少代码冗余,把共有的代码提取出来,下面有个例子说明下:import React from 'react'function NewHigher(ComponentTest){ class NewComponent extends Re...原创 2018-09-05 11:46:50 · 148 阅读 · 0 评论 -
初识React(8):父子组件传参
父级向子级传参父子组件通信主要用到props,如下:在父组件中:import React from 'react'import ChildCom from './childCom.js'class ParentCom extends React.Component { render() { return ( <div> ...原创 2018-09-06 14:55:10 · 320 阅读 · 0 评论