当前位置: 首页 > 工具软件 > ReDex > 使用案例 >

学习React必须要了解的知识---Redex的使用方法

濮俭
2023-12-01

Redux 是 JavaScript 状态容器,提供可预测化的状态管理。

安装

1.安装稳定版:
npm install --save redux

以一个todolist为例

2.在src文件夹下新建store,store下面新建index.js

import { createStore} from 'redux'
import reducer from './reducer'
const store = createStore(reducer)
export default store;

3.store下面新建reducer.js

const defaultState={
    inputValue:'write something',
     list:[
        '早上8点起床',
        '早上9点开会',
        '早上10点做任务'
    ]
   
}
export default (state=defaultState,action)=>{
 return state
}

4.在src下新建todoList.js

import React, { Component } from 'react';
import store from './store'
class TodoList extends Component {
  constructor(props) {
    super(props);
    this.state = store.getState()
  }
  render() {
    return (
      <div style={{ margin: '10px' }}>
            <div>
                <Input  value={this.state.inputValue}   />
            </div>
        </div>
      );
  }
export default TodoList;
 类似资料: