sh-vue3-components 基于vue3前端组件库

完整引入

// main.js
import SHElement from 'sh-vue3-components';
import 'sh-vue3-components/dist/style/theme.scss';
import 'sh-vue3-components/dist/style/index.scss';

app.use(SHElement, ?option);

按需导入

<Button>按钮</Button>
import { Button } from 'sh-vue3-components';

// main.js
import 'sh-vue3-components/dist/style/theme.scss';
import 'sh-vue3-components/dist/style/button.scss';

用户引导

1. 安装数环vue3组件库

npm install sh-vue3-components --save

2. 引入

import { introJs } from "sh-vue3-components/dist/utils";

3. 使用

// 确保所有的 element dom已经渲染完毕，才能调用 introJs
introJs({
  steps: [
    {
      intro: "Hello World! 👋", // 介绍文案
      element: ".element", // dom
    },
    {
      intro: "highlight elements ✨",
      element: "#element",
    },
    {
      intro: "And this is our third step!",
      placement: "left", // 定义弹窗位置， 默认 bottom-start
      element: "#element > div",
    },
    {
      intro: "And this is the last step!",
      element: ".g-fs-14.g-m-r-20",
    },
  ],
});