我有一个用typescript编写的react组件，它有一个输入字段和一个按钮。用户可以输入一个输入，按下按钮后，相关结果将填充到一个表中。我使用React.useEffect（）仅在searchTerm发生变化时运行搜索代码。在useEffect（）中运行代码将填充表行，然后存储这些行以在able组件中显示。

export const SearchWindow: React.FC<Props> = props => {
    const [searchInput, setSearchInput] = React.useState(''); // text value inside input box
    const [searchTerm, setSearchTerm] = React.useState(''); // term to search for (set once search clicked)
    
    const handleSearchInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
        setSearchInput(event.target.value);
    };
    
    React.useEffect(() => {
        if (searchTerm.length > 0) {
            getSearchResults(props.config, searchTerm).then(async searchResults => {
                const rows = searchResults.map(result => {
                    return {
                        cells: {
                            text: result.text,
                        },
                    };
                });
                store.dispatch(setSearchResults(rows));
            });
        }
    }, [searchTerm]); // Only run search if searchTerm changes
    
    // on 1st search, prints blank until another character is typed
    console.log(store.getState().documentationIndex.searchResults); 

    return (    
        <form>
            <input
                type='search'
                placeholder='Enter Search Term'
                onChange={handleSearchInputChange}
                value={searchInput}
            />
            <<button onClick={() => setSearchTerm(searchInput)}>Search</button>
        </form>
        <Table
            ...
            ...
            rows={store.getState().documentationIndex.searchResults}
        />
    );
};

// -------------- store code ----------------------------
import { createSlice, PayloadAction } from '@reduxjs/toolkit';

// Reducer
export interface DocumentationIndexState {
    searchResults: DataTableRow<TableSchema>[];
}

const initialState: DocumentationIndexState = {
    searchResults: [],
};

const store = createSlice({
    name: 'documentationIndex',
    initialState,
    reducers: {
        setSearchResults: (state, action: PayloadAction<DataTableRow<TableSchema>[]>) => {
            state.searchResults = action.payload;
        },
    },
});

export default store.reducer;
export const {
    setSearchResults,
} = store.actions;

**除了在第一次搜寻时以外，程式码的行为与预期相同。**请遵循下列顺序：

1.用户在搜索输入框中输入“hello”，然后单击“搜索”按钮。
1.搜索运行成功，但“表”组件中未显示任何内容。
1.用户在输入框中已经存在的“hello”后面键入任意随机字符。
1.已使用“hello”的搜索结果成功更新表组件。
1.用户从输入框中删除“hello”并键入“foobar”，然后按下“搜索”按钮。
1.正确显示了“payon.com”的搜索结果
打印时
日志（存储、获取状态（）、文档索引、搜索结果）;
就在呈现组件的return（....之前，第一次搜索后结果为空。当我再键入一个字符时，结果将填充。
我在我的智慧的尽头，为什么会发生这种情况，所以任何帮助将不胜感激！