Next.js在按钮上显示/隐藏div

Next.js是一个基于React的轻量级框架，用于构建服务器渲染的React应用程序。它提供了一种简单的方式来创建具有服务器渲染功能的React应用，同时还支持静态导出和动态路由等功能。

在按钮上显示/隐藏div的功能可以通过Next.js结合React的组件化开发来实现。下面是一个示例代码：

import React, { useState } from 'react';

const MyComponent = () => {
  const [showDiv, setShowDiv] = useState(false);

  const toggleDiv = () => {
    setShowDiv(!showDiv);
  };

  return (
    <div>
      <button onClick={toggleDiv}>Toggle Div</button>
      {showDiv && <div>This is a hidden div</div>}
    </div>
  );
};

export default MyComponent;

在上面的代码中，我们使用了React的useState钩子来管理showDiv状态，初始值为false。当按钮被点击时，toggleDiv函数会被调用，通过setShowDiv函数来切换showDiv的值，从而控制隐藏/显示div。

这个示例中的div会根据showDiv的值来决定是否显示。当showDiv为true时，div会被渲染出来，否则不会显示。

这只是一个简单的示例，实际应用中可以根据需求进行扩展和定制。如果你想了解更多关于Next.js的信息，可以访问腾讯云的Next.js产品介绍页面。