我在react项目中使用typecipt。但我不知道为什么输入错误。
告诉我我的代码。
重构此代码如何帮助我
我认为表达式可以使用useTabs函数args代码
比useTabs返回2个值。确定返回值的方式。
我想要一种在所有useTabs参数中都带有“ useTabsProps”的类型并返回值
import React from 'react';
import useTabs from '../hooks/useTabs';
const contents = [
{
tab: 'tab1',
section: 'section1'
},
{
tab: 'tab2',
section: 'section2'
},
]
function UseTabsPage() {
const { currentItem, changeItem } = useTabs(0, contents); // <-- contents error (Expected 1 arguments, but got 2.)
return (
<>
{contents.map((content, index) => <button onClick={() => changeItem(index)}>{content.tab}</button>)}
<div>
{currentItem.section}
</div>
</>
)
}
export default UseTabsPage;
import { useState } from 'react';
type useTabsProps = {
initialTab: number,
allTabs: {
tab: string
section: string,
}[]
}
function useTabs({initialTab, allTabs}:useTabsProps) {
const [ currentIndex, setCurrentIndex ] = useState(initialTab);
return {
currentItem: allTabs[currentIndex],
changeItem: setCurrentIndex
}
}
export default useTabs;
答案 0 :(得分:0)
您的代码中有一个简单的错误。
将useTabs
更改为
const {currentItem, changeItem} = useTabs({initialTab: 0, allTabs: contents});
或更改useTabs
吊钩道具
function useTabs(initialTab: number, allTabs: Array<{ tab: string, section: string }>) {