65 lines
1.7 KiB
JavaScript
65 lines
1.7 KiB
JavaScript
function helloWorld() {
|
|
useEffect(() => {
|
|
// do something
|
|
}, [props.value])
|
|
useEffect(() => {
|
|
// do something
|
|
}, [props.value, props.value, props.value, props.value, props.value, props.value, props.value, props.value, props.value, props.value, props.value])
|
|
}
|
|
|
|
function helloWorldWithReact() {
|
|
React.useEffect(() => {
|
|
// do something
|
|
}, [props.value])
|
|
React.useEffect(() => {
|
|
// do something
|
|
}, [props.value, props.value, props.value, props.value, props.value, props.value, props.value, props.value, props.value, props.value, props.value])
|
|
}
|
|
|
|
function MyComponent(props) {
|
|
useEffect(
|
|
() => {
|
|
console.log("some code", props.foo);
|
|
},
|
|
|
|
// We need to disable the eslint warning here,
|
|
// because of some complicated reason.
|
|
// eslint-disable line react-hooks/exhaustive-deps
|
|
[]
|
|
);
|
|
|
|
return null;
|
|
}
|
|
|
|
function Comp1() {
|
|
const { firstName, lastName } = useMemo(
|
|
() => parseFullName(fullName),
|
|
[fullName],
|
|
);
|
|
}
|
|
|
|
function Comp2() {
|
|
const { firstName, lastName } = useMemo(
|
|
() => func(),
|
|
[props.value, props.value, props.value, props.value, props.value, props.value, props.value, props.value, props.value, props.value, props.value]
|
|
)
|
|
}
|
|
|
|
function Comp3() {
|
|
const { firstName, lastName } = useMemo(
|
|
(aaa, bbb, ccc, ddd, eee, fff, ggg, hhh, iii, jjj, kkk) => func(aaa, bbb, ccc, ddd, eee, fff, ggg, hhh, iii, jjj, kkk),
|
|
[foo, bar, baz]
|
|
);
|
|
}
|
|
|
|
function Comp4() {
|
|
const { firstName, lastName } = useMemo(
|
|
() => foo && bar && baz || baz || foo && baz(foo) + bar(foo) + foo && bar && baz || baz || foo && baz(foo) + bar(foo),
|
|
[foo, bar, baz]
|
|
)
|
|
}
|
|
|
|
function Comp5() {
|
|
const { firstName, lastName } = useMemo(() => func(), [foo]);
|
|
}
|