diff --git a/components/select/demo/select-users.md b/components/select/demo/select-users.md
index 1325cfab9a..27a00a0cc0 100644
--- a/components/select/demo/select-users.md
+++ b/components/select/demo/select-users.md
@@ -14,20 +14,20 @@ title:
 A complete multiple select sample with remote search, debounce fetch, ajax callback order flow, and loading state.
 
 ```tsx
-import React, { useState, useRef, useMemo } from 'react';
 import { Select, Spin } from 'antd';
 import type { SelectProps } from 'antd/es/select';
 import debounce from 'lodash/debounce';
+import React, { useMemo, useRef, useState } from 'react';
 
 export interface DebounceSelectProps<ValueType = any>
-  extends Omit<SelectProps<ValueType>, 'options' | 'children'> {
+  extends Omit<SelectProps<ValueType | ValueType[]>, 'options' | 'children'> {
   fetchOptions: (search: string) => Promise<ValueType[]>;
   debounceTimeout?: number;
 }
 
 function DebounceSelect<
   ValueType extends { key?: string; label: React.ReactNode; value: string | number } = any,
->({ fetchOptions, debounceTimeout = 800, ...props }: DebounceSelectProps) {
+>({ fetchOptions, debounceTimeout = 800, ...props }: DebounceSelectProps<ValueType>) {
   const [fetching, setFetching] = useState(false);
   const [options, setOptions] = useState<ValueType[]>([]);
   const fetchRef = useRef(0);
@@ -54,7 +54,7 @@ function DebounceSelect<
   }, [fetchOptions, debounceTimeout]);
 
   return (
-    <Select<ValueType>
+    <Select
       labelInValue
       filterOption={false}
       onSearch={debounceFetcher}
@@ -96,7 +96,7 @@ const App: React.FC = () => {
       placeholder="Select users"
       fetchOptions={fetchUserList}
       onChange={newValue => {
-        setValue(newValue);
+        setValue(newValue as UserValue[]);
       }}
       style={{ width: '100%' }}
     />