build: 0.0.20

.eslintignore

@@ -0,0 +1 @@
+interface.ts

.eslintrc.cjs

@@ -0,0 +1,14 @@
+require('@rushstack/eslint-patch/modern-module-resolution')
+module.exports = {
+  root: true,
+  extends: [
+    'eslint:recommended',
+    '@vue/eslint-config-standard',
+    'plugin:vue/vue3-recommended',
+    '@vue/eslint-config-prettier/skip-formatting'
+  ],
+  parser: 'vue-eslint-parser',
+  parserOptions: {
+    ecmaVersion: 'latest'
+  }
+}

.gitignore

@@ -0,0 +1,28 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+.DS_Store
+dist
+dist-ssr
+coverage
+*.local
+
+/cypress/videos/
+/cypress/screenshots/
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

.prettierrc.json

@@ -0,0 +1,8 @@
+{
+  "$schema": "https://json.schemastore.org/prettierrc",
+  "semi": false,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "printWidth": 100,
+  "trailingComma": "none"
+}

.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
+}

CHANGELOG.md

@@ -0,0 +1,104 @@
+# 动态导航更新日志
+
+## [0.0.20] (2023.08.15)
+#### feat
+- autoIndex方法添加参数
+
+## [0.0.19] (2023.08.15)
+#### feat
+- 移除include、exclude配置
+- autoIndex支持方法
+
+## [0.0.18] (2023.08.14)
+#### feat
+- menuContent菜单名称包一层span
+- menuContent修改icon中image的规则
+- menuContent修改path支持配置viewBox
+
+## [0.0.17] (2023.07.18)
+#### feat
+- 添加include、exclude配置
+- matchRoute方法添加willGoDefaultIfNeed参数，内置goDefaultIfNeed方法（根据include、exclude、willGoDefaultIfNeed判断是否跳转）
+- 移除了菜单config中的showChildren
+
+
+## [0.0.16] (2023.07.07)
+#### fix
+- 点击无config.route菜单报错
+
+## [0.0.15] (2023.06.30)
+#### refactor
+- 重构resetId，会保留已设置的id,支持字符串id，并暴露resetId方法
+
+#### fix
+- type不是menu的导航点击报错
+
+## [0.0.14] (2023.05.08)
+#### fix
+- disabled无效
+
+## [0.0.13] (2023.05.08)
+#### fix
+- topActiveIndex 在一级导航有多层时计算错误
+- resetActiveIndex 无匹配时置为null
+
+#### refactor
+- pathValueGet 直接用正则匹配
+
+## [0.0.12] (2023.05.04)
+
+#### feat
+- 支持hash
+- matchRoute 方法添加route、setToReactiveMenuData参数
+
+#### refactor
+- 利用正则比对value
+
+#### fix
+- menus监听
+
+## [0.0.11] (2023.04.27)
+#### fix
+- 跳转后菜单选中修正
+
+## [0.0.10] (2023.04.19)
+#### feat
+- icon支持data:image/开头的图片和path://开头的path的d
+
+## [0.0.9] (2023.04.07)
+#### fix
+- el-menu-item点击不触发默认事件
+
+## [0.0.8] (2023.04.06)
+#### feat
+- 当mock、config、menus为ref或reactive时，支持监听
+- 支持匹配route中配置的path
+- config中添加resetId
+
+## [0.0.7] (2023.04.03)
+#### feat
+- 动态参数从:支持${a?}
+
+## [0.0.6] (2023.04.03)
+#### feat
+- 动态参数从:a改成${a}
+
+## [0.0.5] (2023.03.08)
+#### refactor
+- 简化代码
+
+## [0.0.4] (2023.03.07)
+#### improvement
+- 规范方法名
+#### docs
+- 修改文案错误
+
+## [0.0.3] (2023.03.06)
+#### feat
+- 支持 disableMock 配置
+#### refactor
+- 一些小重构
+
+## [0.0.0] (2023.01.05)
+#### feat
+- 初始化

README.md

@@ -0,0 +1,111 @@
+# reactive-menu-item
+
+## demo
+https://simpleoo0o.github.io/reactive-menu-item-demo
+
+## 安装
+```shell
+npm i reactive-menu-item
+```
+
+## 使用
+### 基础用法
+```vue
+<script setup>
+    import ReactiveMenuItem from 'reactive-menu-item/ReactiveMenuItem.vue'
+    // import { ReactiveMenuItem } from 'reactive-menu-item'
+    import useReactiveMenu from 'reactive-menu-item/reactive-menu'
+
+    import menus from '@/menus'
+
+    const reactiveMenuData = useReactiveMenu(menus)
+</script>
+
+<template>
+    <el-container>
+        <el-header>
+            <div class="logo">LOGO</div>
+            <el-menu
+              :default-active="reactiveMenuData.topActiveIndex"
+              mode="horizontal">
+                <reactive-menu-item v-for="item of reactiveMenuData.menus" :key="item.id" :data="item"/>
+            </el-menu>
+        </el-header>
+        <el-container>
+            <el-aside width="200px">
+                <el-menu
+                  :default-active="reactiveMenuData.activeIndex"
+                  mode="vertical">
+                    <reactive-menu-item v-for="item of reactiveMenuData.secondMenus" :key="item.id" :data="item">
+                    </reactive-menu-item>
+                </el-menu>
+            </el-aside>
+            <el-container>
+                <el-main>
+                    <RouterView/>
+                </el-main>
+            </el-container>
+        </el-container>
+    </el-container>
+</template>
+```
+
+### 插槽
+```vue
+
+<template>
+    <el-menu
+      :default-active="reactiveMenuData.activeIndex"
+      mode="vertical">
+        <reactive-menu-item v-for="item of reactiveMenuData.secondMenus" :key="item.id" :data="item">
+            <template #menu-item="{data}">
+                {{data.name}}
+            </template>
+            <template #menu-item-group="{data}">
+                {{data.name}}
+            </template>
+            <template #sub-menu="{data}">
+                {{data.name}}
+            </template>
+        </reactive-menu-item>
+    </el-menu>
+</template>
+```
+
+### mock
+```vue
+<script setup>
+    import useReactiveMenu from 'reactive-menu-item/reactive-menu'
+
+    import menus from '@/menus'
+
+    const reactiveMenuData = useReactiveMenu(menus, {
+        mock: {
+            kgName: 'abc'
+        }
+    })
+</script>
+```
+### 配置项
+```vue
+<script setup>
+    import useReactiveMenu from 'reactive-menu-item/reactive-menu'
+
+    import menus from '@/menus'
+
+    const reactiveMenuData = useReactiveMenu(menus, {
+        config: {
+            autoIndex: true, // 无匹配导航时是否重定向到首页，默认true
+            selfJump: false // 点击当前导航时，是否跳转，默认false
+        }
+    })
+</script>
+```
+
+### provide
+```vue
+<script setup>
+import { inject } from 'vue'
+const reactiveMenuData = inject('reactiveMenuData')
+</script>
+```

copy-file.js

@@ -0,0 +1,44 @@
+const fs = require('fs-extra')
+const glob = require('glob')
+const path = require('path')
+const _ = require('lodash')
+const { globSync } = require("glob");
+const basePath = path.resolve('.') + '/'
+const savePath = basePath + 'dist/'
+
+fs.ensureDir(savePath)
+
+const a = function (paths) {
+  paths = Object.assign({
+    'package.json': true,
+    'README.md': true,
+    'CHANGELOG.md': true,
+    'interface.ts': true,
+    'src/reactive-menu.js': true,
+    'src/ReactiveMenuItem.vue': true,
+    'src/MenuContent.vue': true,
+    'src/ReactiveMenuTree.vue': true
+  }, paths)
+  for (const key in paths) {
+    if (key === 'package.json') {
+      const packageFilePath = basePath + key
+      const packageData = _.cloneDeep(require(packageFilePath))
+      packageData.devDependencies = {}
+      packageData.dependencies = {}
+      packageData.main = './reactive-menu.umd.js'
+      delete packageData.private
+      packageData.scripts = {}
+      fs.writeJsonSync(savePath + key, packageData, { spaces: 2 })
+    } else {
+      const files = glob.globSync(basePath + key)
+      files.forEach(file => {
+        if (paths[key] === true || (paths[key] instanceof Function && paths[key](file))) {
+          fs.copySync(file, savePath + file.replace('src', ''))
+        }
+      })
+    }
+  }
+}
+a()
+
+console.log('copy-file 执行完毕')

index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <link rel="icon" href="/favicon.ico">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>动态导航</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.js"></script>
+  </body>
+</html>