Javascript Redux-找不到要调用调度的目录_Javascript_Reactjs_Redux_React Redux

Javascript Redux-找不到要调用调度的目录

javascript reactjs redux

Javascript Redux-找不到要调用调度的目录,javascript,reactjs,redux,react-redux,Javascript,Reactjs,Redux,React Redux,我真的很难对付Redux。我指的是这个。我是如何按照链接中给出的步骤使我的项目redux部分模块化的现在我被卡住了。我找不到合适的目录来使用dispatch&还要检查我的操作是否正确以下是我的目录目前的样子：我尝试实现redux，但无法找到解决方法我有一个对象数组。我需要根据钥匙找到一个合适的物体。这就是对象数组的外观 [ { "id": "1", "country": "India", "state": "Andhra_Pradesh",

我真的很难对付Redux。我指的是这个。我是如何按照链接中给出的步骤使我的项目redux部分模块化的

现在我被卡住了。我找不到合适的目录来使用dispatch&还要检查我的操作是否正确

以下是我的目录目前的样子：

我尝试实现redux，但无法找到解决方法

我有一个对象数组。我需要根据钥匙找到一个合适的物体。这就是对象数组的外观

[
    {
     "id": "1",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "PM2.5",
     "pollutant_min": "62",
     "pollutant_max": "278",
     "pollutant_avg": "139",
     "pollutant_unit": "NA"
   },
   {
     "id": "2",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "PM10",
     "pollutant_min": "74",
     "pollutant_max": "136",
     "pollutant_avg": "104",
     "pollutant_unit": "NA"
   },
   {
     "id": "3",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "NO2",
     "pollutant_min": "15",
     "pollutant_max": "38",
     "pollutant_avg": "22",
     "pollutant_unit": "NA"
   },
   {
     "id": "4",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "NH3",
     "pollutant_min": "4",
     "pollutant_max": "6",
     "pollutant_avg": "5",
     "pollutant_unit": "NA"
   },
   {
     "id": "5",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "SO2",
     "pollutant_min": "2",
     "pollutant_max": "34",
     "pollutant_avg": "16",
     "pollutant_unit": "NA"
   },
   {
     "id": "6",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "CO",
     "pollutant_min": "20",
     "pollutant_max": "63",
     "pollutant_avg": "33",
     "pollutant_unit": "NA"
   }
]

状态是我搜索模式并返回相关结果所需的键

这就是其他文件的外观

actions/action-types.js：

export const SEARCH = "SEARCH_STATE";

actions/index.js

import { SEARCH } from "./action-types";


export function search(payload) {
    return { type: SEARCH, payload }
};

import {SEARCH } from "../actions/action-types";
const initialState = {
  jsonData: [
    {
     "id": "1",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "PM2.5",
     "pollutant_min": "62",
     "pollutant_max": "278",
     "pollutant_avg": "139",
     "pollutant_unit": "NA"
   },
   {
     "id": "2",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "PM10",
     "pollutant_min": "74",
     "pollutant_max": "136",
     "pollutant_avg": "104",
     "pollutant_unit": "NA"
   },
   {
     "id": "3",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "NO2",
     "pollutant_min": "15",
     "pollutant_max": "38",
     "pollutant_avg": "22",
     "pollutant_unit": "NA"
   },
   {
     "id": "4",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "NH3",
     "pollutant_min": "4",
     "pollutant_max": "6",
     "pollutant_avg": "5",
     "pollutant_unit": "NA"
   },
   {
     "id": "5",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "SO2",
     "pollutant_min": "2",
     "pollutant_max": "34",
     "pollutant_avg": "16",
     "pollutant_unit": "NA"
   },
   {
     "id": "6",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "CO",
     "pollutant_min": "20",
     "pollutant_max": "63",
     "pollutant_avg": "33",
     "pollutant_unit": "NA"
   },
   {
     "id": "7",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "OZONE",
     "pollutant_min": "31",
     "pollutant_max": "77",
     "pollutant_avg": "66",
     "pollutant_unit": "NA"
   }
];




function rootReducer(state = initialState, action) {
  if (action.type === SEARCH) {
      const pattern = new RegExp('And');      
    return {
        jsonData: initialState.jsonData.filter((item) => pattern.test(item.state))
    }
  }
  return state;
}

function getState() {
    console.log(initialState.getState());
}
export default rootReducer;

reducers/index.js

import { SEARCH } from "./action-types";


export function search(payload) {
    return { type: SEARCH, payload }
};

import {SEARCH } from "../actions/action-types";
const initialState = {
  jsonData: [
    {
     "id": "1",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "PM2.5",
     "pollutant_min": "62",
     "pollutant_max": "278",
     "pollutant_avg": "139",
     "pollutant_unit": "NA"
   },
   {
     "id": "2",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "PM10",
     "pollutant_min": "74",
     "pollutant_max": "136",
     "pollutant_avg": "104",
     "pollutant_unit": "NA"
   },
   {
     "id": "3",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "NO2",
     "pollutant_min": "15",
     "pollutant_max": "38",
     "pollutant_avg": "22",
     "pollutant_unit": "NA"
   },
   {
     "id": "4",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "NH3",
     "pollutant_min": "4",
     "pollutant_max": "6",
     "pollutant_avg": "5",
     "pollutant_unit": "NA"
   },
   {
     "id": "5",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "SO2",
     "pollutant_min": "2",
     "pollutant_max": "34",
     "pollutant_avg": "16",
     "pollutant_unit": "NA"
   },
   {
     "id": "6",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "CO",
     "pollutant_min": "20",
     "pollutant_max": "63",
     "pollutant_avg": "33",
     "pollutant_unit": "NA"
   },
   {
     "id": "7",
     "country": "India",
     "state": "Andhra_Pradesh",
     "city": "Amaravati",
     "station": "Secretariat, Amaravati - APPCB",
     "last_update": "18-12-2019 09:00:00",
     "pollutant_id": "OZONE",
     "pollutant_min": "31",
     "pollutant_max": "77",
     "pollutant_avg": "66",
     "pollutant_unit": "NA"
   }
];




function rootReducer(state = initialState, action) {
  if (action.type === SEARCH) {
      const pattern = new RegExp('And');      
    return {
        jsonData: initialState.jsonData.filter((item) => pattern.test(item.state))
    }
  }
  return state;
}

function getState() {
    console.log(initialState.getState());
}
export default rootReducer;

store/index.js：

import { createStore } from "redux";

import rootReducer from "../reducers/index.js";

const store = createStore(rootReducer);



export default store;

index.js：

import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import App from './App';
import store from './store/index';



ReactDOM.render(  
  <Provider store={store}>    
    <App />
  </Provider>
  ,
  document.getElementById('root')
);

从“React”导入React；
从“react dom”导入react dom；
从'react redux'导入{Provider}；
从“./App”导入应用程序；
从“./store/index”导入存储；
ReactDOM.render（
,
document.getElementById（'root'））
);

我想使用SEARCH操作根据模式过滤数据（我将从用户获取该模式作为输入&根据模式过滤数据）

我被困在如何调度操作上&我将如何检查我的操作是否正确工作

请帮帮我。。。坚持了很长时间。我期待工作代码更正。因为我现在在redux完全是个新手

在您的

应用程序组件中提前感谢：

从“./actions/index.js”导入{search}；
类应用程序扩展了React.Component{
/*
*你的代码
*
*/
}
常量mapStateToProps=（状态）=>({
jsonData:state.jsonData
});
const mapDispatchToProps=（调度）=>{
返回{
搜索：event=>dispatch（搜索（event.target.value））
}
}
导出默认连接（mapStateToProps、mapDispatchToProps）（应用程序）
你能在App.js
中发布你所拥有的吗？从技术上讲，这是您可能希望使用connect
、mapstatetrops
和mapsdispatchtorops
的地方。谢谢@Abhigyanayak：为了记录在案，反复问同一个问题，直到有人向你的代码库建议“魔线”没有多大意义，特别是假设你已经接受了答案，并且已经应该解决你的问题。顺便说一句，在线程中，我指的是，我已经修复了实现您所追求的功能并提供了实时演示。@yevgen抱歉。找到正确答案后，我无法阅读你的帖子。谢谢anyway@abhigyannayak：无需担心，但该答案不正确-它忽略了代码中的关键威胁，并且没有提供适当的解决方案（您可以阅读该帖子下的评论），这基本上就是您再次面临该问题的原因。感谢您让我知道……您指出的那个线程对我有效！：D