前端白了又白兔-优快云博客

原创 React之Redux（七）

工作流程好理解的办法 React Components: 借书人 Action Creators: 借书 Store: 图书馆管理员 Reducers: 记录本 Ant Design 1. 安装 npm i antd --save 2. 使用 import ‘antd/dist/antd.css’; 使用Store 1. store/index.js 是一个store import { cr...

2019-02-19 20:08:54 199

原创 React之CSS（六）

一.animation @keyframes定义的动画在执行结束后，最后一帧结束不会保存最后一帧的效果，可以通过在设置animation: all 1s ease-in forwards;保存最后一帧效果二.react-transition-group 1.安装 npm i react-transition-group -D 2.使用 CSSTransition 2.1 先导入 import ...

2019-02-19 20:06:36 217

原创 React之生命周期（五）

概念生命周期是指在某一个时刻，组件会自动调用执行的函数。生命周期流程图具体生命周期过程 1.Initialization constructor() //组件初始化时自动执行 2.Mounting componentWillMount()//在组件即将被挂载到页面的时刻自动执行。先被执行 render() //渲染 componentDidMount() //挂载之后会被执行 3.Upd...

2019-02-19 20:05:08 189

原创 React之prop和虚拟Dom（四）

一、PropTypes 和 DefaultProps 1.PropTypes 和 DefaultProps 通过PropTypes对组件中的数据进行强检验通过defaultProps对组件中数据进行设置默认值 TodoItem.propTypes = { test: PropTypes.string.isRequired, content: PropTypes.arrayOf(PropTy...

2019-02-19 20:04:35 207

原创 React组件化（三）

React的组件化思想一.组件化伪代码 /*子组件 TodoItem.js */ import React, { Component } from 'react'; class TodoItem extends Component { render() { return ( <div> item </div> ) } } /*父组件 TodoList...

2019-02-19 20:03:08 306

原创 React响应式设计及原理

一、实例演示对input输入框实现双向数据绑定，当输入数据时，同时改变和显示input中的数据 class TodoList extends Component { //1.初始化时定义数据 constructor(props) { super(props); this.state = { inputValue: '', list: [] } } render() { return ( &l...

2019-02-19 20:01:27 5813

原创 React起步与JSX（一）

react开发环境准备一.安装node 官网安装（网址）二.安装官方脚手架 create-react-app 1. npm install -g create-react-app 2. create-react-app my-app 将会为我们自动生成一个react项目三.脚手架生成的项目结构讲解 1.项目结构 index.js 入口，引入app，并渲染到页面上 App.test.js...

2019-02-19 20:00:45 237

转载 Vue学习之路四——过滤器filter

文章目录组件中定义过滤器全局定义过滤器串联过滤器今日学习开始 Vue没有内置的过滤器，但是提供了api允许我们自定义过滤器。 1. 过滤器用于何处 1.双花括号之中，通过管道符号 | 连接 2.v-bind表达式中（2.1.0+） //花括号中 {{ message | capitalize }} // v-bind中 <div v-bind: id = 'rawI...

2018-11-25 18:54:20 173

转载 Vue学习之路三——Class与Style绑定

今日学习目录一、绑定 HTML Class 对象语法数组语法用在组件上二、绑定内联样式style 对象语法数组语法自动添加前缀多重值开始学习一、绑定HTML Class 1. 对象语法 a. 添加单个对象 &amp;lt;div :class = &quot; { active : isActive} &quot;&amp;gt;&amp;lt;/div&amp;gt; 上面的语法表

2018-11-25 16:54:22 216

转载 Vue学习之路二——计算属性computed和监视器watch

今日学习目录一、计算属性computed 例子计算属性缓存 vs 方法计算属性 vs 侦听属性计算属性的 setter 二、侦听器watch vm.$watch( expOrFn, callback, [options] ) 开始今日学习一、计算属性设计初衷：在模板中放入表达式非常便捷用于简单运算，但是放入过多会导致模板逻辑过重和难于维护，例如 &amp;lt;div id=&quot;ex...

2018-11-25 16:18:13 263

转载 Vue学习之路一——指令与事件

一、插值 1. 文本数据绑定最常见的形式就是通过Mustache语法{{}}方式进行文本插值 &amp;lt;span&amp;gt; message: {{msg}} &amp;lt;/span&amp;gt; 双向绑定，值改变就会刷新 2. v-once （不需要表达式）只渲染元素和组件一次，随后的重新渲染，元素/组件及其所有的子节点将被视为静态内容并跳过。这可以用于优化更新性能。常见用法：当修改input值...

2018-11-25 11:43:09 393

原创 webpack问题1

初学webpack遇到 Module build failed: TypeError: fileSystem.statSync is not a function at module.exports (C:\Users\Administrator\Desktop\WEB\1-vue\node_modules\babel-loader\lib\utils\exists.js:7:25 发现...

2018-09-26 13:16:04 219

weixin_42589562的博客