前端白了又白兔-CSDN博客

原创 React之Redux（七）

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

2019-02-19 20:08:54 137

原创 React之CSS（六）

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

2019-02-19 20:06:36 157

原创 React之生命周期（五）

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

2019-02-19 20:05:08 113

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

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

2019-02-19 20:04:35 130

原创 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 241

原创 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 5490

原创 React起步与JSX（一）

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

2019-02-19 20:00:45 161

转载 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 112

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

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

2018-11-25 16:54:22 142

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

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

2018-11-25 16:18:13 206

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

2018-11-25 11:43:09 273

原创 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 146

weixin_42589562的博客