React
文章平均质量分 59
weeqe11
这个作者很懒,什么都没留下…
展开
-
react脚手架create-react-app
首先得安装脚手架工具 npm install create-react-app -g 然后新建一个项目 create-react-app demo npm start 开启调试环境 localhost:3000 查看调试页面 npm run eject弹出配置文件,可以自定义位置webpck原创 2017-11-28 11:12:07 · 395 阅读 · 0 评论 -
Redux-connect( )介绍
React-dedux提供connect()方法,用于从UI组件生成容器组件,connect的意思就是把这两种组件连起来import { connect } from 'react-redux'const VisibleTodoList = connect()(TodoList);上面代码中,TodoList是UI组件,VisibleTodoList就是由React-redux通过connect方原创 2017-06-16 14:37:17 · 2945 阅读 · 0 评论 -
Redux:中间件与异步操作
问题:异步操作怎么办?Action 发出以后,Reducer 立即算出 State,这叫做同步;Action 发出以后,过一段时间再执行 Reducer,这就是异步。 怎么才能 Reducer 在异步操作结束后自动执行呢?这就要用到新的工具:中间件(middleware)中间件的概念为了理解中间件,让我们站在框架作者的角度思考问题:如果要添加功能,你会在哪个环节添加? (1)Reducer:原创 2017-06-15 11:45:46 · 379 阅读 · 0 评论 -
React登陆账号之后返回之前的页面
登录之后需要跳转的页面。即在哪个页面登录的,登录完了之后还要再跳转到哪个页面路由的配置登陆的路由 <Route path='/login(/:router)' component={Login} />详情页的路由 <Route path='/detail/:id' component={Detail} />每个商品的页面都有对应的id点击登陆按钮的部分代码 const params = t原创 2017-07-13 16:59:34 · 4402 阅读 · 0 评论 -
React性能检测和优化
性能检测 安装检测工具 npm i react-addons-perf --save,然后在./app/index.jsx中写这段代码 import Perf from "react-addons-perf" if(__DEV__){ window.Perf = Perf }如果报错:Perf is not defined 则删除上面代码第二行和第四行原创 2017-06-11 17:32:07 · 1040 阅读 · 0 评论 -
Fetch的用法以及数据Mock
fetch是一种可代替 ajax 获取/提交数据的技术,有些高级浏览器已经可以window.fetch使用了。相比于使用 jQuery.ajax 它轻量(只做这一件事),而且它原生支持 promise ,更加符合现在编程习惯。安装npm install whatwg-fetch --save,即可安装,为了兼容老版本的浏览器,还需要安装npm install es6-promise --savefe原创 2017-06-20 12:15:13 · 6919 阅读 · 0 评论 -
props和state
区别:state和props的区别在于props是不可变的,而state可以根据与用户交互来改变,这就是为什么有些容器组件需要定义state来更新和修改数据,而子组件只能 用props来传递数据。props的用法 name属性通过 this.props.name 来获取。var Hello = React.createClass({ render: function() { ret原创 2017-06-08 18:56:58 · 318 阅读 · 0 评论 -
jsx语法
使用一个父节点包裹// <p> 外面必须再包裹一层 <div> return ( <div> <p>段落1</p> <p>段落2</p> </div> )jsx里面用{/* */}注释return( //jsx外面的注释 <div> {/* 这是里面的注释 */}原创 2017-06-07 10:48:50 · 634 阅读 · 0 评论 -
Redux中的bindActionCreators
作用:Redux中的 bindActionCreators,这样可以通过bindActionCreators创建的方法,直接调用dispatch(action);(隐式调用)主要用处:bindActionCreators的唯一用处就是需要传递action creater到子组件,并且改子组件并没有接收到父组件上传递的store和dispatch。bindActionCreators的参数let n原创 2017-06-19 13:57:30 · 1778 阅读 · 0 评论 -
Redux基础
安装cnmp install react-redux redux --save文档地址: http://cn.redux.js.org/docs/introduction/index.html作用:无论是移动端还是 pc 端,当你使用 React 或者 vue 开发组件化的 SPA 程序时,组件之间共享信息是一个非常大的问题。例如,用户登录之后客户端会存储用户信息(如userid、头像等),而系统原创 2017-06-13 17:52:22 · 504 阅读 · 0 评论 -
redux connect的装饰器问题
cnpm install babel-plugin-transform-decorators-legacy --save-devcnpm install @babel/plugin-proposal-decorators --save-dev然后npm run eject 弹出个性化配置修改babel部分,添加代码 &amp;amp;amp;quot;plugins&amp;amp;amp;quot;: [ [&amp;amp;am原创 2018-10-16 00:03:50 · 4982 阅读 · 7 评论