javascript - 单击按钮后内容显示一秒钟然后消失(React.js)
问题描述
我正在尝试在单击按钮时显示显示和隐藏数据。我正在使用 axios 从自定义 API 中获取数据。当我单击显示按钮时,它会显示数据,但它会在一秒钟后消失。有什么建议么 ?
这是我获取数据的函数
const Test = () => {
const [quote, setQuote] = useState([]);
const [toggle, setToggle] = useState(false);
const toggleFunction = () =>{
setToggle(!toggle);
}
const getData = async() =>{
try{
const response = await Axios.get("/reminder");
if(response && response.data){
setQuote(response.data);
}
}catch(error){
console.log(error);
}
}
useEffect(()=>{
getData();
}, [])
这是我调用函数并循环的片段
<div className="divBtn">
<button className="styledBtn" type="submit" onClick={toggleFunction}>Show reminders</button>
</div>
</form>
{quote.map((single)=>{
const {id, reminder, time} = single;
return(
<div key={id}>
{toggle ? <LoopReminder id={id} reminder={reminder}/> : null}
</div>
);
})}
解决方案
推荐阅读
- react-context - `componentWillReceiveProps(nextProps, nextContext)` 的新版本是什么?
- c# - 通过按钮启用 C# Streamwriter
- java - @RequestMapping 无法正常工作
- excel - 如何使用数据透视表对变量求和,但子类在哪里重复行?
- visual-studio-code - 如何更改 VS Code 设置以使用 JetBrains Mono 字体
- react-native - 如何以声明性方式使用 react-native-reanimated 启动“spring”动画?
- android - Android 导航深层链接 - 忽略查询
- spring - 当接收到“+”运算符作为参数时,如何避免@RequestParam 连接?
- python - 从 dict 值实例化类的漂亮方法
- powerapps - 启用下拉按钮和文本输入验证