属性 'strDrink' 在类型 'string' 上不存在 (TypeScript)

Question

在我的 React/TypeScript 项目中，我试图在 setCurrentRecipe(cocktail) 之后获取对象“recipe”的键，就像这样：

         const [recipe, setCurrentRecipe] = useState("");
         JSON.parse(xhr.responseText).map(cocktail: any) => {
         return (
         <Button onClick={() => {
            setCurrentRecipe(cocktail)
         }}></Button>
         )}

（鸡尾酒是大对象）

和应用程序组件：

<DrawerHeader>recipe of {recipe.strDrink}</DrawerHeader>

recipe.strDrink 是字符串。我得到：“属性 'strDrink' 在类型 'string' 上不存在”

我该怎么办？

Answer 1

const [recipe, setCurrentRecipe] = useState("") 将 recipe 的初始值设置为空字符串。正如错误消息所说，空字符串上没有属性作为 strDrink。尝试不同的初始值：const [recipe, setRecipe] = useState({strDrink: ""})

属性 'strDrink' 在类型 'string' 上不存在 (TypeScript)

Property 'strDrink' does not exist on type 'string' (TypeScript)

typescript

reactjs

react-state