摘要: Flux 1、引入:在React的应⽤中,状态管理是⼀个⾮常重要的⼯作。我们不会直接对DOM节点进⾏操作,⽽是通过将数据设置给state,由state来同步UI,这种⽅式有个潜在的问题,每个组件都有独⽴的state,并且不能相互传递。如果从⼀个组件将数据传递给另⼀个组件,需要通过props。⽽pro 阅读全文
posted @ 2018-12-19 21:36 Grubber 阅读(602) 评论(1) 推荐(0) 编辑
摘要: 官网:https://reacttraining.com/react-router 后端路由:主要做路径和方法的匹配,从而从后台获取相应的数据 前端路由:用于路径和组件的匹配,从而实现组件的切换。 如:`<Route path="/about" component={About}/>` 一、Rout 阅读全文
posted @ 2018-12-18 22:10 Grubber 阅读(776) 评论(0) 推荐(0) 编辑
摘要: 1. 受控组件:组件处于受控制状态,不可更改输入框内的值。 2. 什么情况下会让组件变成受控组件? - 文本框设置了value属性的时候 - 单选框或多选框设置了checked属性的时候。 3. 如何解决? - 使用state设置值 - 绑定onChange事件 - 在事件处理方法中获取组件的值并更 阅读全文
posted @ 2018-12-09 20:02 Grubber 阅读(1077) 评论(0) 推荐(0) 编辑
摘要: React生命周期主要有7中: 1. componentWillMount() :组件将要挂载时触发 ,只调用1次 2. componentDidMount() :组件挂载完成时触发,只调用1次 3. componentWillReceiveProps(newProps) :只有props改变时触发 阅读全文
posted @ 2018-12-09 20:00 Grubber 阅读(218) 评论(0) 推荐(0) 编辑
摘要: 一、React的特点 1、自动化的UI状态管理:自动完成数据变化与界面效果的更新。 2、虚拟DOM:创建1个虚拟的dom节点树,放在内存里(内存修改数据效率高),数据变化时先修改内存里的虚拟DOM,然后与页面的DOM进行对比,React可以做优化,优化后可只修改变化的部分,缩小节点更改的范围,从而提 阅读全文
posted @ 2018-12-09 12:25 Grubber 阅读(369) 评论(0) 推荐(0) 编辑
摘要: 什么是前后端分离? 前后端为什么要分离? 前后端怎么样分离的? 前后端分离给我们前端技术人员的开发带来什么样的好处? 下面我就带着这些问题,来简单谈谈我了解到的前后端分离情况。 在讲前后端分离之前,让我们先讲一讲什么是MVC? MVC诞生于上世纪70年代,是一种经典的设计模式,全名为 Model-V 阅读全文
posted @ 2018-11-20 21:51 Grubber 阅读(1316) 评论(0) 推荐(0) 编辑
摘要: 当我们用get方法提交表单时,在url上会显示出请求的参数组成的字符串,例如:http://localhost:3000/index.html?phone=12345678901&pwd=123123,在服务器端我们要获取其中的参数来进行操作,这种情况下,就要对请求过来的网址进行拆解了。下面将用3种 阅读全文
posted @ 2018-11-12 22:38 Grubber 阅读(16113) 评论(0) 推荐(0) 编辑
摘要: 1、获取当前窗口宽度区别(需要注意的是用的window还是document)JQuery:console.log($(window).width()); //获取窗口可视区域的宽度 console.log($(document).width()); //获取文档的宽度 console.log($(w 阅读全文
posted @ 2018-10-28 22:53 Grubber 阅读(493) 评论(0) 推荐(0) 编辑
摘要: 游民轮播图,如下图示,当红色进度条走满的时候更换图片,同时下方对应的缩略图也变化。点击缩略图也会更换图片的效果。 该轮播图为过渡变化,所以不用无缝连接,只需5张图片即可。 首先,大图区域给了div,并设置了背景图片,后期变化全是用背景图片的变换来实现。然后给了缩略图的5张小图。 html代码如下: 阅读全文
posted @ 2018-10-07 12:32 Grubber 阅读(201) 评论(0) 推荐(0) 编辑
摘要: 焦点轮播图相对前面讲的逐帧轮播图实现多了两个功能,1、图片轮播可以手动滚动(新增左右箭头),这里重点是实现向左滚动的无缝连接。2、多了下方小圆点,指示图片播放位置,并可以点击小圆点跳转。 那么如何实现呢? 1、无缝连接: 前面逐帧轮播图向右滚动的无缝连接实现,是将最后一张图片负值一个副本放在第一个位 阅读全文
posted @ 2018-10-07 12:18 Grubber 阅读(2211) 评论(2) 推荐(0) 编辑