iteach-menu - npm explorer

export



const iteachMenu: any = {

  IteachMenu,

  IteachMenuTab

};

export default iteachMenu;



eg:

import iteachMenu from 'iteach-menu';



@Component({

  components: {

    'iteach-menu': iteachMenu.IteachMenu,

    'iteach-menu-tab': IteachMenuTab

  }

})

export default class App extends Vue {}





Props



iteach-menu

1.权限树，菜单栏，传递后端返回功能权限树的结果即可

@Prop({ type: Array, default: (): any[] => ([]) }) public authTree!: any[];



2.是否展示菜单栏

@Prop({ type: Boolean, default: true }) public showMenu?: boolean;



3.是否展示标题头

@Prop({ type: Boolean, default: true }) public showHeader?: boolean;



4.默认学科code

@Prop({ type: [String, Number], default: '' }) public defaultSubjectCode?: string | number;

优先级

1.取cookie中的subject，如果没有 或者 不在权限学科中 to 2

2.defaultSubjectCode，如果没有 或者 不在权限学科中 to 3

3.权限下学科列表第一个



5.权限接口域名，默认 iteach-authcenter-api.test.xdf.cn | iteach-authcenter-api.staff.xdf.cn

@Prop({ type: String, default: '' }) public authUrl?: '';





iteach-menu-tab

1.权限树，菜单栏，传递后端返回功能权限树的结果即可

@Prop({ type: Array, default: (): any[] => ([]) }) public menuTab!: any[];





Emit func



iteach-menu

1.学科发生变化事件，返回subjectCode

@Emit('subject-change')

public subjectChange(subjectCode: string | number) {

  return subjectCode;

}



iteach-menu-tab

1.tab发生变化的回调，返回tab-item

@Emit('change')

public handleChange(tab: any): any {

  return tab;

}





工程结构



导出文件 index.js

打包文件 src/index.ts





发布流程



1.注册npm账号：https://www.npmjs.com/

2.加入群组：https://www.npmjs.com/settings/pop-iteach/members

3.修改package.json中版本号verson

4.在项目中切换npm源：指令 npm config set registry https://registry.npmjs.org

5.在项目中登录npm用户：npm adduser

6.发布：npm publish（package.json中配置了prepare命令，publish自动build）

7.切回淘宝镜像：npm config set registry https://registry.npm.taobao.org

8.提交代码合并分支





版本



xx.xx.xx 大版本迭代更新-部分功能迭代更新-bug修复小功能迭代



history

1.0.0 init版本

1.1.0 新增iteach-menu-tab

  1.1.1 修复tab change 多次触发问题

  1.1.2 修复没有根据url适配当前路由bug

  1.1.3 放开不存在的路由默认跳转第一个路由逻辑

  1.1.4 新增隐藏标题头逻辑

  1.1.5 解决初始化重复跳转控制台警告

  1.1.6 修复菜单栏样式问题

  1.1.7 将css打入js中

  1.1.8 添加首页

  1.1.9 修改样式

  1.1.10 修改样式

  1.1.11 修改样式

  1.1.12 修改样式

  1.1.13 remove click

1.2.0 路由策略变更

  1.2.1 修复定位错误bug

  1.2.2 定位优化

  1.2.4 修改样式

  1.2.5 放开不存在的路由默认跳转第一个路由逻辑

  1.2.6 添加不存在的路由默认切换到第一个路由tabs（路由由使用方控制）

  1.2.7 菜单栏自动展开

  1.2.8 菜单栏按钮不展示

  1.2.9 迭代优化

  1.2.10 迭代优化

  1.2.11 导航皮肤切换+导航跳转兼容

  1.2.12 fix 已知bug

  1.2.13 修复匹配错误bug，优化测试环境匹配逻辑

1.3.0 cookie管理学科

  1.3.1 合并代码

  1.3.2 刷新页面 记录当前路径

  1.3.3 优化样式

  1.3.4 优化样式

  1.3.5 menu适配hash路由

  1.3.6 fix menu 跳转 hash 不刷新

  1.3.7 add auth-url params

  1.3.8 退出修改

  1.3.9  迭代优化

target

  1.4.0  东方乐学logo

  1.4.1  导航样式改版

  1.4.2  迭代优化

    1.4.3  样式优化

export

const iteachMenu: any = {
IteachMenu,
IteachMenuTab
};
export default iteachMenu;

eg:
import iteachMenu from 'iteach-menu';

@Component({
components: {
'iteach-menu': iteachMenu.IteachMenu,
'iteach-menu-tab': IteachMenuTab
}
})
export default class App extends Vue {}

Props

iteach-menu
1.权限树，菜单栏，传递后端返回功能权限树的结果即可
@Prop({ type: Array, default: (): any[] => ([]) }) public authTree!: any[];

2.是否展示菜单栏
@Prop({ type: Boolean, default: true }) public showMenu?: boolean;

3.是否展示标题头
@Prop({ type: Boolean, default: true }) public showHeader?: boolean;

4.默认学科code
@Prop({ type: [String, Number], default: '' }) public defaultSubjectCode?: string | number;
优先级
1.取cookie中的subject，如果没有或者不在权限学科中 to 2
2.defaultSubjectCode，如果没有或者不在权限学科中 to 3
3.权限下学科列表第一个

5.权限接口域名，默认 iteach-authcenter-api.test.xdf.cn | iteach-authcenter-api.staff.xdf.cn
@Prop({ type: String, default: '' }) public authUrl?: '';

iteach-menu-tab
1.权限树，菜单栏，传递后端返回功能权限树的结果即可
@Prop({ type: Array, default: (): any[] => ([]) }) public menuTab!: any[];

Emit func

iteach-menu
1.学科发生变化事件，返回subjectCode
@Emit('subject-change')
public subjectChange(subjectCode: string | number) {
return subjectCode;
}

iteach-menu-tab
1.tab发生变化的回调，返回tab-item
@Emit('change')
public handleChange(tab: any): any {
return tab;
}

工程结构

导出文件 index.js
打包文件 src/index.ts

发布流程

1.注册npm账号：https://www.npmjs.com/
2.加入群组：https://www.npmjs.com/settings/pop-iteach/members
3.修改package.json中版本号verson
4.在项目中切换npm源：指令 npm config set registry https://registry.npmjs.org
5.在项目中登录npm用户：npm adduser
6.发布：npm publish（package.json中配置了prepare命令，publish自动build）
7.切回淘宝镜像：npm config set registry https://registry.npm.taobao.org
8.提交代码合并分支

版本

xx.xx.xx 大版本迭代更新-部分功能迭代更新-bug修复小功能迭代

history
1.0.0 init版本
1.1.0 新增iteach-menu-tab
1.1.1 修复tab change 多次触发问题
1.1.2 修复没有根据url适配当前路由bug
1.1.3 放开不存在的路由默认跳转第一个路由逻辑
1.1.4 新增隐藏标题头逻辑
1.1.5 解决初始化重复跳转控制台警告
1.1.6 修复菜单栏样式问题
1.1.7 将css打入js中
1.1.8 添加首页
1.1.9 修改样式
1.1.10 修改样式
1.1.11 修改样式
1.1.12 修改样式
1.1.13 remove click
1.2.0 路由策略变更
1.2.1 修复定位错误bug
1.2.2 定位优化
1.2.4 修改样式
1.2.5 放开不存在的路由默认跳转第一个路由逻辑
1.2.6 添加不存在的路由默认切换到第一个路由tabs（路由由使用方控制）
1.2.7 菜单栏自动展开
1.2.8 菜单栏按钮不展示
1.2.9 迭代优化
1.2.10 迭代优化
1.2.11 导航皮肤切换+导航跳转兼容
1.2.12 fix 已知bug
1.2.13 修复匹配错误bug，优化测试环境匹配逻辑
1.3.0 cookie管理学科
1.3.1 合并代码
1.3.2 刷新页面记录当前路径
1.3.3 优化样式
1.3.4 优化样式
1.3.5 menu适配hash路由
1.3.6 fix menu 跳转 hash 不刷新
1.3.7 add auth-url params
1.3.8 退出修改
1.3.9 迭代优化
target
1.4.0 东方乐学logo
1.4.1 导航样式改版
1.4.2 迭代优化
1.4.3 样式优化