Input字段的Next.js道具未定义

Question

我正在尝试创建一个带有输入字段的SearchBar，该字段用于更新道具"值"；然而，对于用户的输入，value和changeInput道具返回undefined。有人能帮忙吗？

const SearchBar = (value, changeInput) => {
return (
<div>
<div className="flex items-center border-b-[1px] py-6 px-4 border-gray-400 border-solid">
<MagnifyingGlassIcon className="w-6 h-6 mr-8 stroke-gray-400 " />
<input
className="w-full text-2xl placeholder-gray-400 border-none outline-none"
type="text"
placeholder="Search..."
value={value}
onChange={changeInput}
/>
</div>
</div>
);
};
export default SearchBar;

Answer 1

嘿，你需要像这样破坏添加{}的props：

const SearchBar = ({value, changeInput})

或使用props

const SearchBar = (props)，然后得到这样的道具：

props.value
props.changeInput