2023-11-22-1

src/tool/guide.js

@@ -0,0 +1,41 @@
+import { driver } from "driver.js";
+import "driver.js/dist/driver.css";
+//版本一
+const driverObj__ = driver({
+	steps: [
+		{ element: '#Guide_1_1', popover: { title: 'Title', description: 'Description' } },
+		{ element: '.Guide_1_2', popover: { title: 'Title', description: 'Description' } },
+		{ element: '.Guide_1_2', popover: { title: 'Title', description: 'Description' } },
+		{ element: '.Guide_1_2', popover: { title: 'Title', description: 'Description' } },
+		{ element: '.Guide_1_4', popover: { title: 'Title', description: 'Description' } },
+	  ],
+	  // showProgress: true,//控制总页数和当前页数是否显示
+	allowClose:false,
+	showButtons:false,
+	stagePadding:10,//切口到元素的距离
+	stageRadius:5,//切口圆弧度
+	allowKeyboardControl:true,//控制是否可以键盘控制下一步
+	disableActiveInteraction:false,//是否禁用显示元素的交互
+	// overlay: true,
+	onPopoverRender: (popover, options) => {//每个步骤的元素和所有信息
+		console.log(popover,options);	
+		if(options.state.activeIndex >= 1 && options.state.activeIndex <= 3){
+			popover.footer.style.display = 'block'
+		}else{
+			popover.footer.style.display = 'none'
+		}
+		
+	},
+});
+
+
+const openGuide = () =>{
+	// driverObj__.drive();
+	driverObj__.moveNext();
+	driverObj__.movePrevious();
+}	
+
+export{
+    openGuide,
+	driverObj__,
+}