Как включить машинопись в редуксе - PullRequest
0 голосов
/ 06 ноября 2018

Я изучаю избыточность, и я хочу включить машинописный текст в реагировать -redux. У меня есть простое и базовое приложение следующим образом.

Как мне включить машинопись в вышеприведенном. Я пытался увидеть различные примеры, но я потерян в середине. Я пытался увидеть Как набирать действия Redux и редукторы Redux в TypeScript? . Я не могу это адаптировать. Было бы неплохо показать это в очень простом и простом примере, так как я новичок в Typescript и Redux.

import React, { Component } from 'react';
import Main from './components/Main';
import {BrowserRouter} from 'react-router-dom';
import {createStore, combineReducers} from 'redux';

const initialState={
  items:[],
  filter:'none',
  discount:0
}

const itemReducer =(state=initialState, action) =>{
  switch(action.type)
  {
    case 'add_item':
    return Object.assign({},state, {items:[...state.items, action.product]})
    case 'filter':
    return Object.assign({}, state, {filter:action.filter } )
    case 'discount':
    return Object.assign({}, state, {discount:action.discount}) 
    case 'delete_item':
    return Object.assign({},state, {items:[...state.items.slice(0,action.index), ...state.items.slice(action.index+1)]})
    default:
    return state;
  }
}


const addItem = (name, price) =>{
  return{
  type:'add_item',
  product :{
    name:name,
    price:price
  }
}
}

const deleteItem =(index)=>{
  return{
    type: 'delete_item',
    index: index
  }
}

const setFilter =(filterBy)=>{
  return{
  type:'filter',
  filter: filterBy
  }
}

const setDiscount =(discount)=>{
  return{
  type:'discount',
  discount: discount
  }
}

var store = createStore(itemReducer);
store.dispatch(addItem("apple", 100));
store.dispatch(setFilter("name"));
store.dispatch(setDiscount("20"));

store.dispatch(addItem("oranges", 200));
store.dispatch(addItem("pineapples", 500));
store.dispatch(deleteItem(2));
console.log(store.getState())

class App extends Component {
  render() {
    return (
      <BrowserRouter>
        <Main />
      </BrowserRouter>
    );
  }
}

export default App;
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...