react
文章平均质量分 73
白兔仔
所知甚少,唯善学。
展开
-
解决问题:NODE_ENV 不是内部或外部命令,也不是可运行的程序,或者批处理文件
1 环境win10+powershell122 问题我要执行的npm script如下: (脚本的内容不需要关注,需要关注的是它的写法。)"scripts": { "build": "NODE_ENV=production webpack", "dev": "NODE_ENV=development node dev-server.js" }1234两个脚本都报...转载 2018-05-28 22:34:11 · 1750 阅读 · 0 评论 -
react redux Calling dispatch method immediately results in "Reducer may not dispatch actions"
Reducers may not dispatch actionsorCalling dispatch method immediately results in "Reducer may not dispatch actions"一般解决办法,将要发送的action放在定时器里稍后执行setTimeout(()=>{ action.dispatch(canvas...原创 2019-05-21 22:43:33 · 338 阅读 · 0 评论 -
React踩坑记录字符串和变量拼接写法
1.字符串和变量拼接写法const mainUrl = 'http://test.xxxx'<Button shape="round" href={mainUrl}>学习</Button><Button shape="round" href={mainUrl+"/catalog"} >目录</Button>...原创 2019-05-16 12:57:33 · 4492 阅读 · 0 评论 -
React学习笔记(2)redux
store 是核心 其中包含了state ,state的结构和内容决定了UI的样子,UI层可以去触发action(动作),每一个action指代一个state更改为另外一个状态,action会发送到reducer,reducer根据action中的描述将store中的state修改,从而我们的到新的state,新的state就会得到新的ui,如此往复,这就是redux中的数据流4-...原创 2019-05-06 21:58:34 · 208 阅读 · 0 评论 -
React学习笔记(1)
常见问题状态修改在生命周期中怎么用 业务逻辑写在哪里 目录结构如何设计 state怎么设计 Action、Reducer如何分工 高阶组件的使用 (比如store Enhancer 和middleware等) 路由和组件如何关联要学会 1.React思维方式 (react16以上+redux+react router)2.前端架构设计 3.项目优化及部署组件的划分...原创 2019-05-06 21:58:49 · 159 阅读 · 0 评论 -
从零到实战:React无人点餐收银系统教程(4) React事件 方法事件对象以及React中的ref获取dom节点 、React实现类似Vue的双向数据绑定
主要内容:键盘事件 表单事件 事件对象以及React中的ref获取dom节点 、React实现类似Vue的双向数据绑定 获取执行事件的dom节点以及DOM属性:run=(event)=>{ console.dir(event) /*获取执行事件的dom节点 [object HTMLButtonElement]*/ event....原创 2019-01-02 18:21:17 · 403 阅读 · 0 评论 -
从零到实战:React无人点餐收银系统教程(3) React事件 方法
主要内容:React定义方法的几种方式 获取数据 改变数据 执行方法传值在以类继承的方式定义的组件中,为了能方便地调用当前组件的其他成员方法或属性(如:this.state),通常需要将事件处理函数运行时的 this 指向当前组件实例。绑定事件处理函数this的几种方法:第一种方法: run(){ alert(this.state.name)}&l...原创 2019-01-02 17:48:59 · 591 阅读 · 0 评论 -
从零到实战:React无人点餐收银系统教程(2)React目录结构分析
主要内容1.React目录结构分析2.创建组件3.JSX语法4.绑定数据 绑定对象5.React绑定属性( 绑定class 绑定style 图片)删除没有用的文件并添加assets目录如下图:今天主要讲解Home.jsindex.js// React是React的核心库// ReactDOM是提供DOM相关的功能import React from '...原创 2018-11-19 16:54:02 · 622 阅读 · 0 评论 -
从零到实战:React无人点餐收银系统教程(1)项目初始化
react官网:react官网React的介绍:React来自于Facebook公司的开源项目React 可以开发单页面应用 spa(单页面应用)react 组件化模块化 开发模式React通过对DOM的模拟(虚拟dom),最大限度地减少与DOM的交互 (数据绑定)react灵活 React可以与已知的库或框架很好地配合。react 基于jsx的语法,...原创 2018-11-19 16:34:10 · 1217 阅读 · 0 评论 -
package.json文件中 script字段 --摘自阮一锋日志
npm 允许在package.json文件里面,使用scripts字段定义脚本命令。{ // ... "scripts": { "build": "node build.js" }}上面代码是package.json文件的一个片段,里面的scripts字段是一个对象。它的每一个属性,对应一段脚本。比如,build命令对应的脚本是node build.js。命令行下使用np...转载 2018-05-28 23:32:37 · 8988 阅读 · 0 评论 -
使用npm运行react程序报错The 'mode' option has not been set, webpack will fallback to 'production' for this
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.以上的警告指的是没有设定是开发模式还是...原创 2018-05-28 22:56:04 · 889 阅读 · 0 评论 -
webpact+react报错Invalid configuration object. Webpack has been initialised using a configuration obj
React系列学习笔记:1.React与webpack基本配置:https://www.jianshu.com/p/eb2da4fe7f5b 可参考目录分配,但是webpack.config.js配置中loaders写法已不能再使用。会一直报无效的配置,如下:F:\node.js\5-3\5-4>webpackInvalid configuration object. Webpack h...原创 2018-05-28 22:47:52 · 2052 阅读 · 0 评论 -
create-react-app关闭eslint提醒
首先运行npm run eject。然后在package.json文件中配置如下:看自己的需求关闭即可"eslintConfig": { "extends": "react-app", "rules":{ "no-unused-vars":"off", "no-array-constructor":"off", "eq...原创 2019-06-09 18:45:41 · 1541 阅读 · 1 评论