В общем то решил сделать для себя небольшую UI библиотеку, допустим на Tailwind.
Она у меня лежит в отдельном NPM-пакете или подключена через npm link.
Eсть пара ситуаций когда компонент должен иметь своё локальное состояние, вопрос, как это реализовать?
У меня функциональные компоненты, например:
func
import React, { useState } from "react";
export const TestBlock = () => {
const [state, setState] = useState(null);
return (
<button onClick={() => setState(Date.now())}>
blablabla
</button>
)
}
Всё это великолепие падает потому что
"Invalid hook call. Hooks can only be called inside of the body of a function component" и тд.
При этом компонент на классах всё ок.
class
import React from "react";
export class TestBlockClass extends React.Component<{}, { timestamp: number }> {
constructor(props: any) {
super(props);
this.state = {
timestamp: 0
};
}
render() {
return (
<>
<div>
Time {this.state.timestamp}
</div>
<button onClick={() => this.setState({timestamp: Date.now()})}>
тык
</button>
</>
)
}
}
Что делать, как быть?
Или все таки использовать классы?
