英文:
Simple counter changing the color of counter value in react ja
问题
在计数应用程序中,我希望计数值的颜色应该如下(如果计数>0-值应该显示为"绿色",如果计数<0,值应该是"红色"。
英文:
in counter app i want color of counter value should be as (if counter>0- value should be displayed in "green" and counter<0 value should be in "red"
答案1
得分: 0
你可以使用 Hooks 的 useEffect 来实现这个功能。
import React, { useState, useEffect } from 'react';
function Example() {
const [count, setCount] = useState(0);
// 类似于 componentDidMount 和 componentDidUpdate:
useEffect(() => {
// 使用浏览器 API 更新文档标题
document.title = `你点击了 ${count} 次`;
});
return (
<div className={`${(count <= 0) ? "red" : "green"}`}>
<p>你点击了 {count} 次</p>
<button onClick={() => setCount(count + 1)}>
点我
</button>
</div>
);
}
我只翻译了代码部分,没有包括注释和链接。
英文:
You can use Hooks useEffect for that.
import React, { useState, useEffect } from 'react';
function Example() {
const [count, setCount] = useState(0);
// Similar to componentDidMount and componentDidUpdate:
useEffect(() => {
// Update the document title using the browser API
document.title = `You clicked ${count} times`;
});
return (
<div className={`${(count <= 0) ? "red" : "green"}`}>
<p>You clicked {count} times</p>
<button onClick={() => setCount(count + 1)}>
Click me
</button>
</div>
);
}
I just followed the official documentation the added a basic ternary operator
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论