亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

React redux 搜索無法正常工作

React redux 搜索無法正常工作

慕姐4208626 2023-12-14 15:29:04
我正在嘗試在我的 React 應用程序中使用 redux 實現搜索功能。但不知怎的,出了點問題,我找不到問題所在。// Header.jsimport React from 'react';import { useDispatch } from 'react-redux';import { SEARCH_PIZZA } from '@ActionTypes';...other imports// styles for Headerconst useStyles = makeStyles(...)function Header() {  const classes = useStyles();  const dispatch = useDispatch();  const [searchValue, setSearchValue] = React.useState('');  const handleSearch = (e) => {    setSearchValue(e.target.value);    dispatch({ type: SEARCH_PIZZA, searchValue });  };  return (    <div className={classes.root}>      <AppBar position="static">        <Toolbar>          <div className={classes.search}>            <div className={classes.searchIcon}>              <SearchIcon />            </div>            <InputBase              placeholder="Search…"              inputProps={{ 'aria-label': 'search' }}              name="pizzaSearch"              value={searchValue}              onChange={handleSearch}              classes={{                root: classes.inputRoot,                input: classes.inputInput,              }}            />          </div>        </Toolbar>      </AppBar>    </div>  );}export default Header;// reducer.jsimport { SEARCH_PIZZA } from '@ActionTypes';const initialState = {  ...other state values  searchValue: '',};function shopReducer(state = initialState, action) {  switch (action.type) {    case SEARCH_PIZZA:      const { searchValue } = action;      const pizzaList = state.pizzaList.filter((item) =>        item.name.match(searchValue, 'gmi'),      );      return { ...state, searchValue, pizzaList };      ...other code  }}export default shopReducer;我正在使用react-redux庫中的鉤子(如useReducer和useSelector)我正在考慮將搜索邏輯移至組件中,但我希望它保留在 redux 的上下文中。結果,搜索只返回一個空數組......值得一提的是我有一個持久狀態設置
查看完整描述

目前暫無任何回答

  • 0 回答
  • 0 關注
  • 204 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號