react
一只狐猴
这个作者很懒,什么都没留下…
展开
-
react学习笔记(一)
目标:掌握react项目的搭建方式,了解目录结构一、安装基本环境前提:安装了Node和npm ,如果网速不优秀可以用cnpm代理,就是在命令行执行这样一句:npm config set registry https://registry.npm.taobao.org,这方面的帖子很多安装:官网上提供yarn和npm两种安装方式1.用yarn:yarn inityarn ...原创 2018-09-14 16:58:30 · 349 阅读 · 0 评论 -
react全家桶3-react16
上一篇文章react全家桶2-babel7已经提到了一些react相关下载包npm install --save react react-dom react-router-dom测试jsx代码index.jsimport React from 'react';import ReactDom from 'react-dom';ReactDom.render( <d...原创 2019-01-21 11:49:01 · 466 阅读 · 0 评论 -
react全家桶1-webpack4
~创建项目命令行手动创建文件 mkdir react-family-demo 进入文件 cd react-family-demo 此时文件夹是空的初始化:手动创建或用命令:npm init 创建package.json文件:该文件用于定义所有项目所需的模块、项目的配置信息和运行环境,npm install命令将根据这个配置文件下载相应的模块其中dependencies中是项...原创 2019-01-21 11:26:34 · 243 阅读 · 0 评论 -
react全家桶2-bebel7
一、下载包版本7将系列插件都放在了@babel家族下,我的项目使用了react和webpack ,使用npm下载包的代码如下:npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel/preset-react babel-loadernpm install --save-dev webpack webp...原创 2019-01-21 11:29:48 · 633 阅读 · 0 评论 -
react v16.5.2 生命周期方法 + 图解
参考:https://blog.csdn.net/c_kite/article/details/80303341;官网:https://react.docschina.org/docs/react-component.html 注:三个UNSAFE_开头的方法是将三个弃用方法向下兼容,不能使用新的组建API,在17版本前名字还都有效,是不推荐使用的装载过程:1.co...原创 2018-10-17 18:33:25 · 532 阅读 · 0 评论 -
react初学笔记(七)
目标:使用 ES6 map 渲染列表数据 /* 直接在JSX里放一个数组,react会把数组里的所有元素罗列并且渲染出来 render(){ return ( <div> {[ <span>React.js </span>, ...原创 2018-09-20 18:15:23 · 123 阅读 · 0 评论 -
react初学笔记(六)
目标:组件之间值的props参数传递import React, { Component } from 'react'import ReactDOM from 'react-dom'import './index.css'class LikeButton extends Component { // 默认配置也可以这么用,下边是使用||实现的 //这样做就不需要在re...原创 2018-09-20 18:13:48 · 157 阅读 · 0 评论 -
react初学笔记(五)
目标 :理解组件状态,掌握更改状态import React, { Component } from 'react'import ReactDOM from 'react-dom'import './index.css'class LikeButton extends Component { constructor () { super() this.state ...原创 2018-09-20 14:47:46 · 132 阅读 · 0 评论 -
react初学笔记(四)
目标:掌握点击事件等事件监听 import React ,{ Component } from 'react'import ReactDOM from 'react-dom'import './index.css'class Title extends Component { // 事件监听函数会自动传入一个event对象,跟浏览器里的event功能一致 // ...原创 2018-09-20 11:30:06 · 138 阅读 · 0 评论 -
react.js初学笔记(三)
目标:了解组件,组合使用 一、在组件中数据展示: class Header extends Component { render () { const hw = 'Hello world'; // 在JSX中,render很灵活,表达式用{ }包裹 // 其中不限制是变量,计算表达式、函数表达式、样式表达式等,所以像三...原创 2018-09-19 21:58:03 · 227 阅读 · 0 评论 -
react.js初学笔记(二)
目标:对各个部分有一个初步的认识// 只要写react.js组件,就要引入。 其中Component是React.js的组件父类import React ,{ Component } from 'react'// reactDom负责把react组件渲染到页面上import ReactDOM from 'react-dom'import './index.css'// React...原创 2018-09-19 21:17:30 · 115 阅读 · 0 评论 -
react全家桶4-react router4
react router4 官网中文文档地址:https://react-router.docschina.org下载包:npm install react-router-dom --save文档原文:在web应用程序中使用的所有组件都应该从react-router-dom中取react-router应用程序的核心应该是一个router组件,对于web项目,react-route...原创 2019-01-21 18:30:26 · 1075 阅读 · 0 评论