關於React 自動搜尋Autosuggest中文輸入的問題

问题遇到的现象和发生背景
有一個功能,當用戶輸入文字可以自動給建議的選項
问题相关代码,请勿粘贴截图 _
我的代碼如下


import React, { useState, useEffect } from 'react';
import Autosuggest from 'react-autosuggest';
import PropType from 'prop-types';

import { GlobalConstants } from '../../Utilities/CommonUtility';
import { usePostAuth, useLazyLoading } from '../../CustomHook/CustomHook';



const getSuggestionValue = suggestion => suggestion;
const HospitalCodeAutosuggest = (props) => {
 
    const [autoSuggestValue, setAutoSuggestValue] = useState({
        value: "",
        suggestions: [],

    });
  
    // Post With Auth Function
    const { PostWithAuth } = usePostAuth();

    useEffect(() => {
        if (props.value != null) {
                setAutoSuggestValue(prev => {
                    return {
                        ...prev,
                        value: props.value
                    }
                });
            }
    }, [props.value]
    )

    // Teach Autosuggest how to calculate suggestions for any given input value.
    const getSuggestions = (value) => {
        
            PostWithAuth({
                url: "/User/GetHospitalCodeLazy",
                data: {
                    code: value,
                    "FuncCode": GlobalConstants.FuncCode.ViewWebsite,
                    "AuthCode": 1
                },
                success: (response) => {
                    if (response.Data == null || response.Data.length == 0) return;

                    setAutoSuggestValue(prev => {
                        return {
                            ...prev,
                            suggestions: prev.suggestions.concat(response.Data)
                        };
                    });
                }
            });
    };
    const onChange = (event, { newValue }) => {
        
        setAutoSuggestValue(prev => {
            return {
                ...prev,
                value: newValue
            };
        });

        let fakeEvent = Object.assign({}, event);
        fakeEvent.target.name = props.name;
        fakeEvent.target.value = newValue;
        props.handleOnChange(fakeEvent);
    };


    // Autosuggest will call this function every time you need to update suggestions.
    // You already implemented this logic above, so just use it.
    const onSuggestionsFetchRequested = ({ value }) => {
        getSuggestions(value);
      //  onSuggestionsClearRequested();
    };
   
    // Autosuggest will call this function every time you need to clear suggestions.
    const onSuggestionsClearRequested = () => {
        setAutoSuggestValue(prev => {
            return {
                ...prev,
                suggestions: []
            };
        });
    };
    const inputProps = {
        value: autoSuggestValue.value,
        onChange: onChange,
        name: props.name,
       
    };
    const onSuggestionSelected = (event, { suggestion, suggestionValue, index, method }) => {
        event.preventDefault();
        console.log('ping... ', suggestion)
    }
    // Use your imagination to render suggestions.
    const renderSuggestion = suggestion => (
        <div>
            {suggestion.HospitalCode}<br />
            {suggestion.HospitalName}
        </div>
    );

    return (
        <div style={{ width: "100%" }}>
            <div className={"input-item edit"}>
                <Autosuggest
                    suggestions={autoSuggestValue.suggestions}
                    onSuggestionsFetchRequested={onSuggestionsFetchRequested}
                    onSuggestionsClearRequested={onSuggestionsClearRequested}
                    getSuggestionValue={getSuggestionValue}
                    renderSuggestion={renderSuggestion}
                    focusInputOnSuggestionClick={false}
                    inputProps={inputProps}
                    onSuggestionSelected={onSuggestionSelected}
                />
            </div>
        </div>
    );
}

HospitalCodeAutosuggest.defaultProps = {
    style: {},
    handleOnChange: () => { }
}

HospitalCodeAutosuggest.propTypes = {
    handleOnChange: PropType.func,
    name: PropType.string,
    value: PropType.string,
    handleSuggestionSelected: PropType.func,
    style: PropType.object
};




export default HospitalCodeAutosuggest;

运行结果及报错内容
當是輸入中文(注音拼音)還沒有按下enter,建議的內容就會出現,但是如果用滑鼠點擊選項,輸入框不會將所選到的值帶入input框

我想要达到的结果
我希望可以點選完後將值帶入input框