if condition and dynamic inline style
Sun Jun 18 2023 00:50:07 GMT+0000 (Coordinated Universal Time)
Saved by
@sarfraz_sheth
#react.js
var React = require("react");
var ReactDOM = require("react-dom");
const CURRENT_DATE = new Date();
console.log(CURRENT_DATE);
const CURRENT_YEAR = CURRENT_DATE.getFullYear();
const CURRENT_TIME = CURRENT_DATE.getHours();
console.log(CURRENT_TIME);
let greeting;
const greetingColor = {
color: "Black"
};
if (CURRENT_TIME < 12) {
greeting = "Good Morning";
greetingColor.color = "red";
} else if (CURRENT_TIME < 18) {
greeting = "Good Afternoon";
greetingColor.color = "green";
} else {
greeting = "Good Night";
greetingColor.color = "blue";
}
ReactDOM.render(
<div>
<h1 className="heading" style={greetingColor}>
{greeting}
</h1>
</div>,
document.getElementById("root")
content_copyCOPY
the css attribute and heading name is change by js in his if condition and then injected in the render
Comments