32 lines
890 B
TypeScript
Executable File
32 lines
890 B
TypeScript
Executable File
import React, { useContext } from 'react'
|
||
import { RepositorySearchContext } from '../context/RepositorySearchContext'
|
||
|
||
export default function RepositorySearchInput () {
|
||
const context = useContext(RepositorySearchContext)
|
||
|
||
return (
|
||
<div>
|
||
<label htmlFor="keyword-input">
|
||
搜索关键词：
|
||
<input type="text" id="keyword-input"
|
||
value={context.keyword}
|
||
onChange={({ target }) => {
|
||
context.setKeyword(target.value)
|
||
}}
|
||
onKeyDown={evt => {
|
||
const value = (evt.target as HTMLInputElement).value
|
||
if (evt.key.toLocaleLowerCase() === 'enter') {
|
||
context.setKeyword(value)
|
||
context.search(value, 1)
|
||
}
|
||
}}
|
||
/>
|
||
</label>
|
||
|
||
<button onClick={() => {
|
||
context.search(context.keyword, 1)
|
||
}} disabled={context.loading}>搜索</button>
|
||
</div>
|
||
)
|
||
}
|