内部系统需要加个新手指引的交互。平时看的这种交互就是对页面上的 dom 上 加 popover 弹框描述每个按钮或者操作的功能,然后下一步(或者我知道了)。如下图

现在的需求是要结合用户实际操作,比如「新建」按钮 用户必须点了该按钮 才会到下一步引导;这种有什么好点的技术实现方案呢?
|  |      1Chism      2022-04-24 20:22:46 +08:00 via Android 录个视频完事 | 
|  |      2chnwillliu      2022-04-24 20:43:32 +08:00 via Android 事件冒泡,然后在这个引导组件里监听 body ,判断是否点击了要点击的元素,这样就不至于要塞 hook 到实际的业务代码里了。 至于遮罩,现代 CSS 对付这点儿事还是小菜一碟的,mask clip-path 兼容性都很好。 | 
|  |      3chnwillliu      2022-04-24 20:48:23 +08:00 via Android 还有记得 prevent 掉 tab 键的默认效果,把用户锁住。 | 
|  |      4lifesimple OP @Chism 是啊  我也觉得 做这个功能引导需求成本感觉要比功能本身还花时间 大领导的需求 哎 | 
|  |      5Chism      2022-04-25 10:50:23 +08:00 @lifesimple  看到这种引导都直接关掉,关不掉就快速点击下一步过完,看都不看,很多人都这样 | 
|  |      6lifesimple OP @Chism 害  内部系统面向领导编程 |