Skip to content

Instantly share code, notes, and snippets.

@wssgcg1213

wssgcg1213/test.html

Created October 17, 2023 04:05
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save wssgcg1213/66153d32bacf37674300298806d003be to your computer and use it in GitHub Desktop.
Save wssgcg1213/66153d32bacf37674300298806d003be to your computer and use it in GitHub Desktop.
Download ZIP
useEffect with conditional expression functions
Raw
test.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Test for useEffect with rax.js and React</title>
<script src="https://g.alicdn.com/code/lib/rax/1.2.3/rax.min.umd.js"></script>
<script src="https://g.alicdn.com/code/lib/driver-dom/2.2.2/driver-dom.umd.min.js"></script>
<script src="https://g.alicdn.com/code/lib/react/18.2.0/umd/react.production.min.js"></script>
<script src="https://g.alicdn.com/code/lib/react-dom/18.2.0/umd/react-dom.production.min.js"></script>
</head>
<body>
<div id="raxRoot"></div>
<div id="reactRoot"></div>
<script>
function RaxComponent() {
const [state, setState] = Rax.useState(true);
Rax.useEffect(state ? () => {
console.log('fn1 in Rax');
} : () => {
console.log('fn2 in Rax');
}, [state]);
return Rax.createElement('div', {
onClick: () => {
setState(!state);
},
}, [
'Rax Component, state: ',
state.toString(),
]);
}
Rax.render(
Rax.createElement(RaxComponent),
raxRoot,
{
driver: DriverDOM,
},
);
</script>
<script>
function ReactComponent() {
const [state, setState] = React.useState(true);
React.useEffect(state ? () => {
console.log('fn1 in React');
} : () => {
console.log('fn2 in React');
}, [state]);
return React.createElement('div', {
onClick: () => {
setState(!state);
},
}, [
'React Component, state: ',
state.toString(),
]);
}
const root = ReactDOM.createRoot(reactRoot);
root.render(React.createElement(ReactComponent));
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment