React
React学习总结系列文章
不积跬步,无以至千里.
前端路途之遥远,需之不断探索,一个的探索,不如团队合作,共同探索学习,团队的力量才是最大的,不断学习,提升自己,分享知识共荣进步。
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
初始化创建react项目失败,解决办法
解决办法:1、由于网络原因,某些依赖包加载失败,解决方法:设置 npm 镜像为 cnpmnpm config set registry https://registry.npm.taobao.org2、 清除 npm 缓存,目录:C:\Users\Administrator\AppData\Roaming\npm-cache删除该目录下的所有文件,重新 create-react-app...原创 2019-08-31 22:01:04 · 1980 阅读 · 0 评论
-
Module parse failed: Unexpected character ‘@‘ (1:0)
react引入antd的样式时,解析不了@原因:include的原因{ test: /\.(css|less)$/, // include: path.resolve(__dirname, './src'),// 这里会直接到 src 文件下找 less/css 文件进行编译,这里是项目优化的一个小技巧 use: [ { loader: MiniCssExtractPlugin.loader, options: {原创 2020-09-15 17:18:37 · 3806 阅读 · 1 评论 -
Plugin/Preset files are not allowed to export objects, only functions. In /Users/cpp/Desktop/日常/cil-
wepback配置react失败{ test: /\.jsx?$/, exclude: /(node_modules)/, use: { loader: 'babel-loader', options: { presets: ['@babel/preset-react'] }, },},原创 2020-09-14 16:47:51 · 520 阅读 · 0 评论 -
react todolist实践总结
react状态组件state定义在constructor里外的区别react组件中数据的挂载方式react代码学习原创 2020-09-05 14:26:12 · 214 阅读 · 0 评论 -
React生命周期,简单摘要
react生命周期简单认识,可直接使用原创 2020-08-13 10:54:13 · 156 阅读 · 0 评论 -
.jsx和.js文件后缀类型有何区别?
这个是查到比较合理的答案了;点击这里原创 2020-08-13 10:03:31 · 1956 阅读 · 0 评论 -
ReactDOM
1、ReactDOM是什么?ReactDOM包提供了DOM特定的方法,可以在应用程序的顶层使用。也是特殊操作DOM的接口。2、引入方式使用 npm 和 ES6,可以用 import ReactDOM from ‘react-dom’。如果使用 npm 和 ES5,你可以用 var ReactDOM = require(‘react-dom’)。3、ReactDOM提供的方法有哪些?re...原创 2019-08-31 23:01:19 · 212 阅读 · 0 评论 -
React初识
React 是什么?React 是一个声明式,高效且灵活的用于构建用户界面的 JavaScript 库。使用 React 可以将一些简短、独立的代码片段组合成复杂的 UI 界面,这些代码片段被称作“组件”。通过 Props 传递数据在 React 应用中,数据通过 props 的传递,从父组件流向子组件。在jsx语法中,我们的js代码需要放在{代码,注释等等}中,创建一个js语法环境。给组...原创 2019-09-12 15:23:09 · 180 阅读 · 0 评论 -
React练手小例子小结
在结合项目实战中,就是自己写的一个demo,在将各个页面、导航模块后,自己在途中遇到的一些,做一个简短的总结。页面结构首先在页面的模块化中,在这里我用了(UI框架地址)UI框架,和平时自己写页面一样,利用布局,然后分块,头,主体,侧边栏,底部。然后就在对应的页面展开,jsx和css。路由模块在使用路由的时候,主要是想和Vue的路由模式那样,去写。有路由的index文件,和路由的配置conf...原创 2019-09-12 14:37:02 · 1189 阅读 · 0 评论 -
React路由报错You should not use <Switch> outside a <Router>
修改方式用Router替换掉Switchimport React, { Component } from 'react'import { BrowserRouter as Router, Route } from 'react-router-dom'import AllComponents from '../components/index'import routesConfig fro...原创 2019-09-10 18:12:44 · 5136 阅读 · 1 评论 -
React何时使用.jsx?
我的理解是:在代码中包含html的时候,就可以使用jsx语法。如果只是单纯的js语法,直接使用.js就可以了。当然全部使用.js也是可以的。原创 2019-09-09 14:38:23 · 508 阅读 · 1 评论 -
react入门初始化项目
一、ReactJS简介React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站。做出来以后,发现这套东西很好用,就在2013年5月开源了。由于 React 的设计思想极其独特,属于革命性创新,性能出众,代码逻辑却非常简单。所以,越来越多的人开始关注和使用,认为它可能是将来 Web...原创 2019-08-31 22:28:08 · 192 阅读 · 0 评论 -
React-router报错:Cannot read property 'location' of undefined
React Router被拆分成三个包:react-router,react-router-dom和react-router-native,目前网站搭建只需要引入react-router-dom即可;原创 2019-09-05 18:26:16 · 7128 阅读 · 0 评论 -
初学React,'React' must be in scope when using JSX react/react-in-jsx-scope
在App.js中引入了,新建的几个模块:问题在于,新建的模块中必须引入React,因为使用了jsx语法。当然还有就是导入的React,必须是大写的。原创 2019-09-05 17:53:54 · 1821 阅读 · 0 评论 -
React开发注意点
组件名称必须以大写字母开头。React 会将以小写字母开头的组件视为原生 DOM 标签。例如:<div /> 代表 HTML 的 div 标签,而 <Welcome /> 则代表一个组件,并且需在作用域内使用 Welcome。所有 React 组件都必须像纯函数一样保护它们的 props 不被更改。将函数组件转换成 class 组件建一个同名的 ES6 cla...原创 2019-09-05 15:57:40 · 255 阅读 · 0 评论 -
React函数组件中为什么可以直接使用props?
此答案只是一个浅显的答案,来源于react官网:https://react.docschina.org/docs/components-and-props.html当 React 元素为用户自定义组件时,它会将 JSX 所接收的属性(attributes)转换为单个对象传递给组件,这个对象被称之为 “props”。代码示例:const element = <Welcome name="...原创 2019-09-03 16:15:39 · 2443 阅读 · 0 评论 -
React对jsx的理解
什么是jsx?const element = <h1>Hello, world!</h1>;它被称为 JSX,是一个 JavaScript 的语法扩展。为什么要使用jsx?如果不使用jsx,就需要我们调用React.createElement()方法来生描述。我觉得这样的开发效率是不高的。const element = React.createElement(...原创 2019-09-03 15:42:06 · 325 阅读 · 0 评论 -
React添加点击事件,并且改变this指向
实例:import React, {Component} from 'react';// import logo from './logo.svg';import Cat from './Cat'import './App.css';class App extends Component{ constructor(props) { super(props); thi...原创 2019-09-01 21:36:06 · 443 阅读 · 0 评论 -
React入门小实例
1、修改app.js,设置stateimport React, {Component} from 'react';// import logo from './logo.svg';import './App.css';// 修改过之后的class App extends Component{ constructor(props) { super(props); th...原创 2019-08-31 23:55:50 · 188 阅读 · 0 评论 -
React-router的小测试例子
生成项目的步骤以及流程:npm install -g create-react-appcreate-react-app demo-appcd demo-appnpm install react-router-dom在App.js中引入一下代码,只是普通的路由跳转import React from "react";import { BrowserRouter as Route...原创 2019-09-06 10:35:31 · 367 阅读 · 0 评论
分享