Question

我想用搜索图标（类似于Material-UI上的图标）构建一个非常基本的搜索栏，并在用户点击Enter或单击搜索时使用搜索字段当前值调用一个函数。输入。我是Material-UI的新手，我正努力通过不同的文本字段元素来寻找自己的出路。

我目前有此代码

import Input from '@material-ui/core/Input';

class ...somecode
...somecode
  constructor(props) {
    super(props);
    this.state = {
      resources: [],
      value: '',
    };
  }

  handleChange(event) {
    console.log(event.target.value);
    this.setState({ value: event.target.value });
  }

  search(/* access value upons enter/ search icon click */) { <--------------------------
  }
...some code
return (
  <form id="search">
    <Input type="text" value={value} onChange={(event) => { this.handleChange(event); }} placeholder="Search..." autoFocus fullWidth />
  </form>
);

p.s：我很难摆弄输入套件中所有可用的API和选项（我强烈建议对它们在文档中的相关性进行解释）

构建基本的搜索栏Material-UI

0 个答案: