React&Redux actionCreators
0x01 创建文件 创建actionCreators.js import {INPUT_VALUE_CHANGE,ADD_TODO_ITEM,DEL_TODO_ITEM} from './ActionTypes'; export const getInputChangeAction = (value) =>({ type : INPUT_VALUE_CHANGE, value }); export const getAddItemAction = () =>({ type: ADD_TODO_ITEM }); export const getDelItemAction = (index)=>({ type: DEL_TODO_ITEM, index }); 0x02 修改 修改ToDoList.js相关的地方 handleInputChange(e) { const action = getInputChangeAction(e.target.value); store.dispatch(action); } handleBtnClick() { const action = getAddItemAction(); store.dispatch(action); } handleItemClick(index) { const action = getDelItemAction(index);...
React&Redux ActionTypes
0x00 前言 ActionTypes是为了防止在大型项目的开发中action中的type出现打错字之类的错误,此时,控制台不会报错,但功能异常。使用ActionTypes后,页面将会出现报错,减少排错时间 0x01 创...
React之Redux工作流程
阮一峰 0x00 render函数 render() { return ( <div style={{ width: '500px', padding: '10px' }}> <Input value={this.state.inputValue} style={{ width: "400px", marginRight: "15px" }} onChange={this.handleInputChange} /> <Button type="primary" > 提交 </Button> <List bordered dataSource={this.state.list} renderItem={item => ( <List.Item> {item} </List.Item> )} /> </div> ) } 0x01 在src下创建store/index.js 这里就创建好了Store import {createStore} from 'redux'; import reducer from './reducer'; const store = createStore(); export...
React Fragment
https://react.docschina.org/docs/fragments.html Fragment相当于占位符吧,正常情况下,React中子组件只能返回一个Dom节点,而Fragment可以让你的子组件返回多个Dom节点 父组件 import React, { Fragment } from 'react'; import ToDoItem from './ToDoItem'; class ToDoList extends React.Component { constructor(props) { super(props); //组价状态 this.state =...
Hugo_blog搭建
CodeSheep视频 Hugo中文文档 我的环境为MacOS 安装 Hugo brew install hugo 生成站点 hugo new site hugo_blog cd hugo_blog 安装一个主题 hugo的主题 从官网选用一个主题 例如我选的zozo 看到insetallation 执行命令 git clone https://github.com/imzeuk/hugo-theme-zozo themes/zozo 写...
Spring Boot中使用MongoDB
pom文件中 <dependencies> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-data-mongodb</artifactId> </dependency> </dependencies> application.properties中 ##mongo配置 spring.data.mongodb.host=127.0.0.1 spring.data.mongodb.port=27017 spring.data.mongodb.database=test 主类中 @SpringBootApplication(exclude = DataSourceAutoConfiguration.class)...