NextJS添加图片弹窗提示

首先安装 npm i reactjs-popup

代码如下：

import React from ‘react’;
import Popup from ‘reactjs-popup’;
import ‘reactjs-popup/dist/index.css’;

export default function PopupGfg(){
return(
<div>
<h4>NextJs Popup</h4>
<Popup trigger={<button> Click to open popup </button>}
position=”right center”>
<div>GeeksforGeeks</div>
<Link href=”#”>{<Image src=”/myalipay.jpg” width={300} height={400} alt=”banner”/>}</Link>
</Popup>
</div>
)
};

 

注： Position Enums: ‘top left’ ‘top right’ ‘bottom right’ ‘bottom left’ ‘right center’ ‘left center’ ‘top center’ ‘bottom center’ ‘center center’