在我的 App.tsx 中我得到了这个:
- function.eslint(@typescript-eslint/explicit-function-return-type) 缺少返回类型
在我的主类组件中我得到了这些:
- 方法定义中缺少辅助功能修饰符 render.eslint(@typescript-eslint/explicit-member-accessibility)
- function.eslint(@typescript-eslint/explicit-function-return-type) 缺少返回类型
我正在使用 React 和 TypeScript。 对于 linter,我使用 ESLint 并使用 Prettier 进行代码格式化。
我找到了这个信息:https://github.com/typescript-eslint/typescript-eslint/blob/v1.6.0/packages/eslint-plugin/docs/rules/explicit-function-return-type.md ,但我不知道如何以及在哪里应用它。
应用程序.tsc
class Main extends Component {
render() {
return (
<Router>
<div>
<Link to="/">Home</Link>
<br />
<Link to="/component1">Component1</Link>
<br />
<Link to="/component2">Component2</Link>
<Route exact path="/" render={() => <h1>Home Page</h1>} />
<Route path="/component1" component={Component1} />
<Route path="/component2" component={Component2} />
</div>
</Router>
);
}
}
组件1.tsc
interface Props {
number: number;
onNumberUp: any;
onNumberDown: any;
}
const Component1 = (props: Props): JSX.Element => {
return (
<div>
<h1>Component1 content</h1>
<p>Number: {props.number}</p>
<button onClick={props.onNumberDown}>-</button>
<button onClick={props.onNumberUp}>+</button>
</div>
);
};
const mapStateToProps = (state: any) => {
return {
number: state.firstReducer.number,
};
};
const mapDispachToProps = (dispach: any) => {
return {
onNumberUp: () => dispach({ type: 'NUMBER_UP' }),
onNumberDown: () => dispach({ type: 'NUMBER_DOWN' }),
};
};
Reducer 和 actions 位于不同的文件夹中。
组件 1 和组件 2 类似。
有人知道如何修复这个错误吗?
最佳答案
Missing accessibility modifier on method definition render.eslint(@typescript-eslint/explicit-member-accessibility)
可访问性修饰符是诸如公共(public)/私有(private)/ protected 之类的东西。对于渲染,这应该是公开的。
因此将单词 public 添加到 render() 中:
class Main extends Component {
public render() {
...
}
}
Missing return type on function.eslint(@typescript-eslint/explicit-function-return-type)
你不应该在这里出现这个错误。这告诉您添加要渲染的返回类型,但由于您已经扩展了 React.Component 它应该能够从类型定义中加载类型。
您是否已将 @types/react 和 @types/react-dom 添加到您的项目中?
如果没有,npm i -D @types/react @types/react-dom
看起来您的 redux 代码还需要 @types/redux
:(npm i -D @types/redux
)
从 'redux' 导入 { Dispatch };
const mapDispatchToProps = (dispatch: Dispatch<any>) => {
return {
onNumberUp: () => dispatch({ type: 'NUMBER_UP' }),
onNumberDown: () => dispatch({ type: 'NUMBER_DOWN' }),
};
};
最后一点 - 我不喜欢 ESLint 中的公共(public)/私有(private)访问器规则。我只会禁用它。更多信息请参见此处(第 1 点):https://medium.com/@martin_hotell/10-typescript-pro-tips-patterns-with-or-without-react-5799488d6680
关于reactjs - 缺少函数的返回类型 - 在 react ( typescript )代码中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56041623/