---
title: 复合搜索组件
order: 1
---

基础用法

```jsx
import React, { useState } from 'react';
import ReactDOM from 'react-dom';
import { YwSearch } from '@ywfe/yw-design';

const App = () => {
  const [filterProps, setFilterProps] = useState({});
  const [loading, setLoading] = useState(false);
  return (
    <div>
      <YwSearch
        loading={loading}
        onSearch={(keyword) => {
          console.log(keyword);
          setLoading(true);
          setFilterProps({ ...filterProps, keyword });
          setTimeout(() => {
            setLoading(false);
          }, 2000);
        }}
      />
    </div>
  );
};

ReactDOM.render(<App />, mountNode);
```