yiyun's Blog
·
freeCodeCamp | Front End Development Libraries | 笔记
内容提要
本文介绍了使用Sass变量、嵌套CSS、Mixins、@if和@else、@for、@each、@while、Partials、@extend、React渲染方法、高级JavaScript、&&、三元表达式、唯一的key属性、Array.map()、Array.filter()、Object.assign、删除数组项、展开运算符、常量Action类型、store侦听器、中间件、Redux计数器、不可变state、Provider、state映射到props等内容。
关键要点
-
使用 Sass 变量存储数据
-
嵌套 CSS 使样式更具层次感
-
使用 Mixins 创建可重用的 CSS
-
使用 @if 和 @else 为样式添加逻辑
-
使用 @for 创建 Sass 循环
-
使用 @each 映射列表中的项
-
应用样式直到条件满足 @while
-
使用 Partials 将样式拆分为更小的块
-
将一组 CSS 样式扩展 (@extend) 到另一个元素
-
React 组件必须闭合
-
使用默认 props 值
-
通过 propTypes 限制 props
-
使用 this.props 访问 props
-
创建有状态组件
-
使用 setState 更新 state
-
可控的 input 和 Form
-
将状态作为 props 传递给子组件
-
传递回调作为 props
-
添加事件侦听器
-
使用 Array.map() 动态渲染元素
-
为同级元素提供唯一的 key 属性
-
使用 Array.filter() 动态过滤数组
-
创建 Redux Store
-
定义 Redux Action 和 Action 创建者
-
处理 Store 中的 Action
-
使用中间件处理异步 Action
-
不可变 state
-
使用 Object.assign 复制一个对象
-
将 Redux 连接到 React
-
将状态逻辑提取到 Redux
-
使用 Provider 将 Redux 连接到 React
