From 65d74e8b640b0851641bd183303c5291033ff372 Mon Sep 17 00:00:00 2001 From: fxy060608 Date: Thu, 22 Apr 2021 15:05:43 +0800 Subject: [PATCH] feat: add onNavigationBarButtonTap --- packages/uni-h5/dist/uni-h5.esm.js | 24 +++++++---- .../framework/components/page/pageHead.tsx | 41 ++++++++++--------- 2 files changed, 39 insertions(+), 26 deletions(-) diff --git a/packages/uni-h5/dist/uni-h5.esm.js b/packages/uni-h5/dist/uni-h5.esm.js index aad048f0f..8fa24dd89 100644 --- a/packages/uni-h5/dist/uni-h5.esm.js +++ b/packages/uni-h5/dist/uni-h5.esm.js @@ -13502,7 +13502,7 @@ var PageHead = /* @__PURE__ */ defineComponent({ clazz, style: style2 } = usePageHead(navigationBar); - const buttons = __UNI_FEATURE_NAVIGATIONBAR_BUTTONS__ && usePageHeadButtons(navigationBar); + const buttons = __UNI_FEATURE_NAVIGATIONBAR_BUTTONS__ && usePageHeadButtons(pageMeta); const searchInput = __UNI_FEATURE_NAVIGATIONBAR_SEARCHINPUT__ && navigationBar.searchInput && usePageHeadSearchInput(pageMeta); __UNI_FEATURE_NAVIGATIONBAR_TRANSPARENT__ && navigationBar.type === "transparent" && usePageHeadTransparent(headRef, pageMeta); return () => { @@ -13544,6 +13544,7 @@ function createBackButtonTsx(pageMeta) { } function createButtonsTsx(btns) { return btns.map(({ + onClick, btnClass, btnStyle, btnText, @@ -13555,12 +13556,13 @@ function createButtonsTsx(btns) { key: index2, class: btnClass, style: btnStyle, + onClick, "badge-text": badgeText }, [btnIconPath ? createSvgIconVNode(btnIconPath, iconStyle.color, iconStyle.fontSize) : createVNode("i", { class: "uni-btn-icon", style: iconStyle, innerHTML: btnText - }, null, 12, ["innerHTML"])], 14, ["badge-text"]); + }, null, 12, ["innerHTML"])], 14, ["onClick", "badge-text"]); }); } function createPageHeadBdTsx(navigationBar, searchInput) { @@ -13696,7 +13698,10 @@ function usePageHead(navigationBar) { style: style2 }; } -function usePageHeadButtons(navigationBar) { +function usePageHeadButtons({ + id: id2, + navigationBar +}) { const left = []; const right = []; const { @@ -13708,7 +13713,7 @@ function usePageHeadButtons(navigationBar) { } = navigationBar; const isTransparent = type === "transparent"; const fonts = Object.create(null); - buttons.forEach((btn) => { + buttons.forEach((btn, index2) => { if (btn.fontSrc && !btn.fontFamily) { const fontSrc = getRealPath(btn.fontSrc); let fontFamily = fonts[fontSrc]; @@ -13719,7 +13724,7 @@ function usePageHeadButtons(navigationBar) { } btn.fontFamily = fontFamily; } - const pageHeadBtn = usePageHeadButton(btn, isTransparent); + const pageHeadBtn = usePageHeadButton(id2, index2, btn, isTransparent); if (btn.float === "left") { left.push(pageHeadBtn); } else { @@ -13732,7 +13737,7 @@ function usePageHeadButtons(navigationBar) { right }; } -function usePageHeadButton(btn, isTransparent) { +function usePageHeadButton(pageId, index2, btn, isTransparent) { const iconStyle = { color: btn.color, fontSize: btn.fontSize, @@ -13754,7 +13759,12 @@ function usePageHeadButton(btn, isTransparent) { btnText: btn.fontSrc && btn.fontFamily ? btn.text.replace("\\u", "&#x") : btn.text, btnIconPath: ICON_PATHS[btn.type], badgeText: btn.badgeText, - iconStyle + iconStyle, + onClick() { + invokeHook(pageId, "onNavigationBarButtonTap", extend({ + index: index2 + }, btn)); + } }; } function usePageHeadSearchInput({ diff --git a/packages/uni-h5/src/framework/components/page/pageHead.tsx b/packages/uni-h5/src/framework/components/page/pageHead.tsx index 3af8f3ad5..a36d1348b 100644 --- a/packages/uni-h5/src/framework/components/page/pageHead.tsx +++ b/packages/uni-h5/src/framework/components/page/pageHead.tsx @@ -1,5 +1,5 @@ import { computed, defineComponent, ref } from 'vue' -import { isArray } from '@vue/shared' +import { extend, isArray } from '@vue/shared' import { Input } from '@dcloudio/uni-components' import { getRealPath } from '@dcloudio/uni-platform' import { @@ -45,7 +45,7 @@ export default /*#__PURE__*/ defineComponent({ const { clazz, style } = usePageHead(navigationBar) const buttons = (__UNI_FEATURE_NAVIGATIONBAR_BUTTONS__ && - usePageHeadButtons(navigationBar)) as PageHeadButtons + usePageHeadButtons(pageMeta)) as PageHeadButtons const searchInput = (__UNI_FEATURE_NAVIGATIONBAR_SEARCHINPUT__ && navigationBar.searchInput && @@ -112,7 +112,15 @@ function createBackButtonTsx(pageMeta: UniApp.PageRouteMeta) { function createButtonsTsx(btns: PageHeadButton[]) { return btns.map( ( - { btnClass, btnStyle, btnText, btnIconPath, badgeText, iconStyle }, + { + onClick, + btnClass, + btnStyle, + btnText, + btnIconPath, + badgeText, + iconStyle, + }, index ) => { return ( @@ -120,6 +128,7 @@ function createButtonsTsx(btns: PageHeadButton[]) { key={index} class={btnClass} style={btnStyle} + onClick={onClick} badge-text={badgeText} > {btnIconPath ? ( @@ -283,21 +292,10 @@ function usePageHead(navigationBar: UniApp.PageNavigationBar) { } } -interface PageHeadButton { - btnClass: UniApp.ClassObj - btnStyle: UniApp.StyleObj - btnText: string - btnIconPath?: string - badgeText?: string - iconStyle: UniApp.StyleObj -} +type PageHeadButton = ReturnType +type PageHeadButtons = ReturnType -interface PageHeadButtons { - left: PageHeadButton[] - right: PageHeadButton[] -} - -function usePageHeadButtons(navigationBar: UniApp.PageNavigationBar) { +function usePageHeadButtons({ id, navigationBar }: UniApp.PageRouteMeta) { const left: PageHeadButton[] = [] const right: PageHeadButton[] = [] const { buttons } = navigationBar @@ -305,7 +303,7 @@ function usePageHeadButtons(navigationBar: UniApp.PageNavigationBar) { const { type } = navigationBar const isTransparent = type === 'transparent' const fonts = Object.create(null) - buttons.forEach((btn) => { + buttons.forEach((btn, index) => { if (btn.fontSrc && !btn.fontFamily) { const fontSrc = getRealPath(btn.fontSrc) let fontFamily = fonts[fontSrc] @@ -319,7 +317,7 @@ function usePageHeadButtons(navigationBar: UniApp.PageNavigationBar) { } btn.fontFamily = fontFamily } - const pageHeadBtn = usePageHeadButton(btn, isTransparent) + const pageHeadBtn = usePageHeadButton(id, index, btn, isTransparent) if (btn.float === 'left') { left.push(pageHeadBtn) } else { @@ -331,6 +329,8 @@ function usePageHeadButtons(navigationBar: UniApp.PageNavigationBar) { } function usePageHeadButton( + pageId: number, + index: number, btn: UniApp.PageNavigationBarButton, isTransparent: boolean ) { @@ -358,6 +358,9 @@ function usePageHeadButton( btnIconPath: ICON_PATHS[btn.type], badgeText: btn.badgeText, iconStyle, + onClick() { + invokeHook(pageId, 'onNavigationBarButtonTap', extend({ index }, btn)) + }, } } -- GitLab