Reactjs 如何在typescript和react项目中重构一个类型表达式
我在react项目中使用typescipt。但我不知道为什么会有打字错误 给我看看我的代码 重构这段代码对我有什么帮助 我认为表达式使用tabs函数args代码 然后UseTab返回2个值。制作如何返回值 我想要一个在所有useTabs参数中都是“useTabsProps”并返回值的类型 页Reactjs 如何在typescript和react项目中重构一个类型表达式,reactjs,typescript,Reactjs,Typescript,我在react项目中使用typescipt。但我不知道为什么会有打字错误 给我看看我的代码 重构这段代码对我有什么帮助 我认为表达式使用tabs函数args代码 然后UseTab返回2个值。制作如何返回值 我想要一个在所有useTabs参数中都是“useTabsProps”并返回值的类型 页 您的代码中有一个简单的bug。 将usetab更改为 const{currentItem,changeItem}=useTabs({initialTab:0,allTab:contents}); 或者更改
您的代码中有一个简单的bug。 将
usetab
更改为
const{currentItem,changeItem}=useTabs({initialTab:0,allTab:contents});
或者更改usetab
hook道具
函数usetab(initialTab:number,allTabs:Array){
我不知道你在问什么,但也许你的意思是使用标签({initialTab:0,allTabs:contents})
?
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;