diff --git a/miniprogram/custom-tab-bar/index.json b/miniprogram/custom-tab-bar/index.json new file mode 100644 index 0000000..c0ad054 --- /dev/null +++ b/miniprogram/custom-tab-bar/index.json @@ -0,0 +1,8 @@ +{ + "component": true, + "lazyCodeLoading": "requiredComponents", + "usingComponents": { + "t-tab-bar": "tdesign-miniprogram/tab-bar/tab-bar", + "t-tab-bar-item": "tdesign-miniprogram/tab-bar-item/tab-bar-item" + } +} \ No newline at end of file diff --git a/miniprogram/custom-tab-bar/index.scss b/miniprogram/custom-tab-bar/index.scss new file mode 100644 index 0000000..761e72b --- /dev/null +++ b/miniprogram/custom-tab-bar/index.scss @@ -0,0 +1 @@ +/* custom-tab-bar/index.wxss */ \ No newline at end of file diff --git a/miniprogram/custom-tab-bar/index.ts b/miniprogram/custom-tab-bar/index.ts new file mode 100644 index 0000000..d75b77f --- /dev/null +++ b/miniprogram/custom-tab-bar/index.ts @@ -0,0 +1,48 @@ +// custom-tab-bar/index.ts +Component({ + /** + * 组件的属性列表 + */ + properties: {}, + + /** + * 组件的初始数据 + */ + data: { + value: 'label_1', + list: [ + { value: 'label_1', label: '首页', icon: 'home', pagePath: '/pages/one/index' }, + { value: 'label_2', label: '应用', icon: 'app', pagePath: '/pages/two/index' }, + { value: 'label_3', label: '聊天', icon: 'chat', pagePath: '/pages/three/index' }, + { value: 'label_4', label: '我的', icon: 'user', pagePath: '/pages/four/index' }, + ], + }, + + /** + * 组件的方法列表 + */ + methods: { + onChange(e: WechatMiniprogram.CustomEvent<{ value: string }>) { + const value = e.detail.value + this.setData({ value }) + const item = this.data.list.find((i) => i.value === value) + if (item && item.pagePath) { + wx.switchTab({ + url: item.pagePath, + }) + } + }, + init() { + const page = getCurrentPages().pop() + const route = (page && page.route) || '' + const activeItem = this.data.list.find( + (item) => route.includes(item.pagePath.replace(/^\//, '')) || item.pagePath.includes(route), + ) + if (activeItem) { + this.setData({ + value: activeItem.value, + }) + } + }, + }, +}) diff --git a/miniprogram/custom-tab-bar/index.wxml b/miniprogram/custom-tab-bar/index.wxml new file mode 100644 index 0000000..fc0b064 --- /dev/null +++ b/miniprogram/custom-tab-bar/index.wxml @@ -0,0 +1,6 @@ + + + + {{item.label}} + + \ No newline at end of file diff --git a/project.config.json b/project.config.json index 4fc9b6f..2fbfd29 100644 --- a/project.config.json +++ b/project.config.json @@ -3,7 +3,10 @@ "miniprogramRoot": "miniprogram/", "compileType": "miniprogram", "setting": { - "useCompilerPlugins": ["typescript", "sass"], + "useCompilerPlugins": [ + "typescript", + "sass" + ], "babelSetting": { "ignore": [], "disablePlugins": [], @@ -50,4 +53,4 @@ "include": [] }, "appid": "你的appid" -} +} \ No newline at end of file