如何在react js和redux中过滤时返回所有存储

在React.js和Redux中过滤并返回所有存储的方法如下：

首先，确保你已经安装了React.js和Redux，并且已经设置好了你的项目。
创建一个Redux store来存储你的数据。你可以使用Redux的createStore函数来创建一个store，并传入一个reducer函数。reducer函数负责处理不同的action，并更新store中的数据。

import { createStore } from 'redux';

// 定义初始状态
const initialState = {
  data: [],
};

// 定义reducer函数
const reducer = (state = initialState, action) => {
  switch (action.type) {
    case 'ADD_DATA':
      return {
        ...state,
        data: [...state.data, action.payload],
      };
    default:
      return state;
  }
};

// 创建store
const store = createStore(reducer);

创建一个React组件来展示和过滤存储的数据。你可以使用React的useState和useSelector钩子来获取store中的数据。

import React, { useState } from 'react';
import { useSelector } from 'react-redux';

const FilteredData = () => {
  const [filter, setFilter] = useState('');
  const data = useSelector((state) => state.data);

  const filteredData = data.filter((item) =>
    item.toLowerCase().includes(filter.toLowerCase())
  );

  return (
    <div>
      <input
        type="text"
        value={filter}
        onChange={(e) => setFilter(e.target.value)}
      />
      <ul>
        {filteredData.map((item, index) => (
          <li key={index}>{item}</li>
        ))}
      </ul>
    </div>
  );
};

在你的应用中使用这个组件。

import React from 'react';
import { Provider } from 'react-redux';
import store from './store';
import FilteredData from './FilteredData';

const App = () => {
  return (
    <Provider store={store}>
      <FilteredData />
    </Provider>
  );
};

export default App;

这样，你就可以在React.js和Redux中过滤并返回所有存储的数据了。用户可以通过输入框输入过滤条件，组件会根据条件过滤数据并展示在页面上。

注意：以上代码只是一个简单的示例，实际项目中可能需要根据具体需求进行修改和扩展。