更新记录

1.1.3（2021-07-17）

上传演示项目

1.1.2（2021-07-17）

1、把演示数据从组件里提出来，写到readme里了，供测试参考； 2、增加了@tabBarCreateEvent事件，即tabBar组件创建时触发的事件； 3、修改了@tabBarChangeEvent事件的返回参数形式。

1.1.1（2021-07-17）

修改readme.md文件

平台兼容性

tbs-tabBarInPage 自定义tabBar组件

组件名：tbs-tabBarInPage

自定义tabBar组件

说明

在页面中生成tabBar的组件，该tabBar完全自定义，不受小程序2~5个tab的限制。

安装方式

本组件符合easycom规范，HBuilderX 2.5.5起，只需将本组件导入项目，在页面template中即可直接使用，无需在页面中import和注册components。

API

tbs-tabBarInPage Props

属性说明：

tabBar里面的数据结构需要有一定的格式要求，示例：

{ //此处为tabBar属性的demo演示数据
    selected: 0, // 当前选择的tab的index序号
    color: "#7A7E83", // 非选择项的字体颜色
    selectedColor: "#3cc51f", // 选择项的字体颜色
    list: [{ // tabBar 里的item项目列表
        // 此处图标icon的路径可以有两种表示方式，一种是图片路径格式，另一种是采用base64格式
        // 图片路径格式必须要保证路径下的文件是存在的，演示如下：
        // selectIconPath: "/static/images/tabbar/home-a.png",
        // iconPath: "/static/images/tabbar/home.png",
        // 下面是demo数据，为了便于使用测试，使用base64格式加载icon
        selectIconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAADIUlEQVRoQ+2ZO2gTcRzHP7+r+Nh8DA4macVFVFRU3IRuLlYXnaSL+ChtbS7BQRSxQqFDtblWW/G16CK6iDrpIIh2URcfoHTyLkUcShfBpbmfJK01bdPcI7mYQm4L93t8P7/f//6vCMv8kWWunwZAqQ4mLD2EcBplP0IOeIfLgJ2St9XueHU70KtGYh0WytmSQpWUnRKrmhBVA2i5qlvdFeTFHSwrULjt5jCzafldDZCqAMQtPSwwBLT4FPVGXVJOWt77tF/SrGKA5oyeU2EghJBJhJSdlAchfOdcQgPEBnWNYRSqfqoSAQj9dlIuhI0RCmDTNd3VZHAd4UDYxMV+Ak9yLt3ZtEwEjRcYIGHpMeAmsCFoMg/7b2rQ4/TIiyBxAwHEM3pRhL4gCYLaKqQdUzJ+/XwBtGR0rWtwA+W438CV2Cncc5KcQkS94ngCxAZ1v2FwC9jtFazK78dcl45sWj6Vi1sWIDGk7Sh3gZVVFuc33JQKnU5SHi7lsCRAwtJ+4LzfTFHaKfQ5plwqlWMRwGZLN+aUOwhtUYoKGjs/1U6v4OREt0wumIL//WzJaKsrhSGzJWiCGtmPK5x0THn9N99cB+KWdgqM1EhIRWkUuhxTRvNBCgCxjLYawquKotbeuc025XkBIJHRdoT7sxoeA/nVtv4e4Rk6+20KZ+yk3C4eQiMifAXWo/TWn/rCeJnRpUzZpgzPDaFisYkhvVzPAHZSriw5CxWGUwMgwsEn9DY6EGF9vUM3OuBdo78WvxReipIVYVohVthbKav9hyhhWaMOjIly9HtKfsybnod1Gy6PgO2hIWoA8MU2ZUc5gQlL83dBe0NBRA2gMOqY0lVOXHxI74lyoi4B8kv9wnl6odCKFsqoO9AA8BpXjQ6EqFDjG5i/d454M1cXs9DM5W1+xQz+RA1Q4i+qRfdCm4Y11uTiBFdfdOTzcg55ZFU44pjytOyJrHAqq6NbuSKxH2xT9i2sjdfVYgpY5VXQGrz/qUqHk5InvgHyhs0Z3ePCTjForoHIkikExnPK56wpH0sZeF6v/y/hfvM2APxWKiq7Zd+BP2J+ZUCnohS9AAAAAElFTkSuQmCC",
        iconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAERElEQVRoQ+2ZTYhbVRTH/+cmDriRUheCCgoiOLpwBCm6ENwUF1rLMMm9L4QsNG1n7Fhm1Cp+gRGUilq02kH7IZR2SO694xBR6UZQV4robFqRYEVFF+LGCDLqzCTvyBuScJuPSV7mOWQgdxXeO/ec/++ce99974SwzQdtc/0YArSr4MLCwgO+7x8AsAtAFcCSEOJkMpn8OOqKR1qBXC4nRkdH3wRwqJ1QZj5eKpVmcrmcHxVIZAD5fP6WWCwWiL+vi7hPiGhWSvldFBCRABQKhQeFEMcA3OiIOkVEAdAqMz8FYL9z75caRHGzEJsGMMYcBvBak5DDSqmj7jWt9ZNE9Kp7jYiekVK+shmIvgGstVcyc5D1RmaJ6Eff92c8z2u7WbXWewEcI6Ib6qKJ6Ey5XJ6enJz8ux+QvgC01rcDeJuI7nGCnq9UKrPpdPrSRkJqe+UtALsduy8rlcqhdDq9FBYiNIDWOklE7wC42gn2hlLq8TDBjTHHAUw7c/4AMKOUmg/jJxSA1vo5InrJDcDMU57nnQgTtG6rtZ6pbfTGdCJ6WUr5fK/+egIoFos7VldXg4ylnbVbqlarj6RSqc97DdbOzlq72/f9OSK62fH9/tra2oF0Ol3u5rsrgLV2FzMHGR5zAhRXVlamM5nMb90C9HLfWnsdgBPMfL9jf1EIMZVMJr/YyMeGANbaDDOfBjDiODmilHq2F2FhbYwxrwN4wpm3SkQHpZTvdfLVEcBae4SZn65PZOY1IURWSnkurLAw9saYhwG8C+AKZ95RpVRw3rSMFoB8Pn9NLBY7BWCPI/5CPB7PJhKJb8KI6ddWa30XgNNEdJvj43w8Ht83MTFx2bK9DKBQKNwrhAiWzE2OeLO8vLw/m83+1a+gfubNz89fFY/HA4ikM/8nItonpfy0sR/rP7TWB4lorilYTin1Yj8CoppjjHkBQK7J36NKqXWt6xWoZf6zNkEHFQBCiD3B90UdICOEOLtORLTAzPWyDSwAEU1KKU829oAxZo6ZS0S00ynZoAHUl1JZKRW8T7V+EzetuYEDaN6TLY/RIUBUj5+an24JHVYg4oS3uBtWoN+T2Fp7K4C7fd//F8DXnud930+1trwCTleu8TJYE/5RP925LQWw1u5k5osAru2Q7Z9HRkbuGB8f/7PXamwpgNbaI6JC402R6Jzv+/8QUdAnXR++7z+USqXODCRAp2x1y+JGMN3mRnoODAHalGJYgTDnwHAJDZcQgFrz1tY+L7+SUgYtjp7G/7GErLVnmTkTCGDmxzzPC/40aYyWx+ji4uL1lUrlV8fmBwBhOsb1z77mTkKn692S0/BDRHullB9uCBDcNMYEbe+gmTtIY0kpdWezoI6tRa31LBEFPZkdA0DxO4AppdQHPQMEhtbasWq1OiaEaPwltNUwRHRJCPFtIpG40C521/b6VgsOG28IEDZjUdtv+wr8B8kwYU+OeseKAAAAAElFTkSuQmCC",
        text: "首页"
    }, {
        selectIconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAACmUlEQVRoQ+2YP2hTURSHv18yCQ5FtIK2zxZnF3EUsZPUinSpIEVqUcHF5mZwE2wHJ6V9HRwUxU5FdHCoWnCq1FV0qEK3vBdpBRHcBJEciVJJY5q+JC+SCw28JZxz+b537r93hOc/ec7PjkC9CvaHtr9kXDBxG7GGsQ4sZ4ypQl7f0qh+WysQhLYMHK8B+h64Fju9aVWibQJBaFeA+3UAv8sYifJ60YpEWwT23bXdu36ygnGoHpzBfNFptOMEekM7IXidBCxj9BfyKiSJrRXTlgoEs5bDCJNAmTFezGsuSez/FJjDGEsEJSbjnKYSxdYISr8CTywbrLEKHE4E1WkCvTM2LPEsEXw5qOMEQnsguOSlQN+MdZVgFdHtpUAwazcxJhPDl2eQuB7ldKeRnMrY1BZxENoZYKFREMtwqjihV43mbcSnItA7YxclHjUDETu1xNBSchkcMSY42Qw88DV22ttk7u+0TQJ/53DV1tbM3G4FqkbuW8RCrQNvs0BotpFcWdqg4v+UwRod7mnsdG7LRVwJ2qEC5V1rNMppvuYi9kHAYLHodNpbgTJ45ezwbQ2U+QuxU7+3FTBYKjoNeCsAzMVO4/4KVJ1R3q2B6k9Q7wRKxsCnvJa8nULVXQzvKlB9e/VNYNMZ8O9ttMMvc9VngHcCEreinG54exuVGIpyeumtwI8M3Z8n9MVXgZXY6Uj1F5BPu9C92OmqtwKCy5HTQ38FMhyNJvTOV4H12OlArQ6AH20VYyHO6+y2Ao32OILQRoCNp9H05PF1WvAtdeY2CHqm7WA2y3DJGBIMJifbPlLwOHI6v1VkKgKVg/dM256sGDRxTNBn0Mefp2t7XDAoH1QfgI+Cxdjpeb281AWSQKYZsyOQ5ttsZqxfr75fQF7akegAAAAASUVORK5CYII=",
        iconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAEPUlEQVRoQ+2ZXWhcRRTH/+dukieFIlJBBBuq+KC24kNBFLEI1i/EJeScexNjLVX0weqTiqjYPlgUffADpRbFILI7ZwLGULFWfYhEBAWxYC0KRdcXi4RC9cUQkjsycTbcbHez3eyG3AsdWFju3Z35/+acM2fmDKHgjQquHxcAVrNgpVK5rFQqjQF4FcCfAE4DmBkYGDhQLpfP9sL662oBVZ0BcEsToceJaB8zf9MtxLoBqOojAA6vIvDfKIp4eHj4024g1gXAWnsRgBPOuSuDuHeI6IU0TR8kohcBbArPj4jIfbkDUNVbAXwdhM329fVtHxoa8v6/1FT1DIBL/HciupaZT64VYr0s8KRz7nUvyjl3OI7jR7MCrbXWOTccAB5m5vdzBaCq4wB2B1FjIvJRVqCqejfaH57tF5EDuQGw1pacc78C2OpFLSwsbBkdHf0jK9AYs4+I3swlgKreD2AyuM9MHMc+HlY0Y8woEdWtki8LGGPeI6K9QfFBEXmuCcBdRPRZ7iwwOTm5aX5+3rvP5iDuThE51ghgrR1zzn2YO4CG4DwlIlc3C05VPQSgvjI9JSKvbXgQT0xM3Jum6ZGMkLdE5IkWAD8BuC7Eya44jr/YUIBqtfpQFEUfZETUiOgGZv67UZiq3gxgeQ8kIl3loq7+7IWXSqXdzrnbskKJaBsz+1k+p6nqKwCe9i+I6AwzX7rW2V/qI/vnjA+vWNoafLvleEQ0XSqVRrLbhiYW+AXANR2K/gGA3zedk/AaAVy946xpVXX5eYuBawDGzyejqurvALZ0CLD0cyKaYGZeYe0GC3QK8L1z7u04jutLYltdIV78VmKtEKPMXKkP1LEFug26toTN42Z570RER5n57kIBeLFZN85OYiEsYK0ddM79Fma9JiKDhbJAtVq9PYqir0IgTzPzzkIBZM/XRDTOzHuKBnAQwLNB9IocVYgYMMYYIhIPkKbpniRJ/Inv/9zQaR7YoGX0OwA7AsDOJEmmiwYwC2Bpz5Sm6WCSJD7zF8MCU1NTF8/Nzf1TF9zoAbl3IWPMdiI63iwHFCIGjDExEVWb5YBCAKjqywCeCQAvMfPz2YUn9y6kqp8D2BVE3yMi9WpGMYJYVf+qVzmIaDMz+xVpueXaAsaYrUR0Kqg9ISLXZ8XnPgastWXn3MdB9Lsi8lihALJncSJqWsXu2IUaZwDAocXFxTdGRkb8Yb2nTVX97JdDBr4xSZIfu7bAKgp9te2YiHzSKwpV9f7v4+A0M1/erN+ellXCAGeJ6Ms0Tb8lIl/gqvX399fO91bSWutvbq5K03SMiB4Pfba8iuqqsGWt3euc85Xom3o16y36aVmC7wqgPpiq+iPeAwDuAHBFj2GMiCSt+uwJQLbzSqWyLYqiHf7yLtR+fP3Hf+o3k+34ZonoZ+fcySiKjra7hu05QDt1vX5/AaDXM9ppf/8BjdUzT5WdwHQAAAAASUVORK5CYII=",
        text: "分类"
    }, {
        selectIconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAACp0lEQVRoQ+2ZvWsUURDAf3Mn2okW2mj2sFFMQLS0sFAEbYQIWgrxCwQhu4d/gPEfMJvYiKgJljZRbEwhWgiWKn6BgnjvThAsFDvB25G95MJG924/E+8FF5Zt5s3M783szPsQLH/Ecv/5D9CN4LZp3b4uYBRhWMEhfIPOFyoYwAiYIOBVdT1zny7KlzKiXygCodPVNicQjgGHMjmkPBCY/1Xl/udxaWUaGxHOBVCb1N0qnBYYU9iS13g4TuCrwqwoM426vMuqKzOA4+t1YAzYkNVYgvxPYNZ4ciGL3kwAjq93gZNZDOSQfWo8OZB2XGqAmq8vFfakVVxETsE0Paml0ZEKwPFV0ygrW8Z4kuhfooDj62tgpGznUup7ZDw53E+2L8Aq5XxfFhGuNly51EuoJ4AzpZdRJlLOVLxYhZGgzdaK8LiQHmHCuHIlTkcsgDOtwwQ8AzbmNhwxWsJk/KDCfjMub//0JxZgyNebAmdzO7/QoZZmrQQAFG41PTmXCDDk6xGBh4WcXwGAUKXC0aYn81Hf/oqA4+sN4PxAAgi3m64sy4w4gHLKZskp1Amq8L7hyq6eEahd0x3a5mPh2V+hFArVBsLOlisfuj4ui4AzpadQ7gwygApnmq7MxAP4Ogl4gwwA+MaTeixAzdc5hdFBBhC41/DkeK8IPAf2JgJIug7d7Z6dPpDmSdf5XxhP9vUC+AZs6mcrUA626vIkjT9ZZRZXAG8Sxn03nmxeswB2p9Ba+IntLqPWNzLrlxJhaSptD/wvFnOLAHYvp63f0IRRsHpL2Ukj2zf1HQibj1W6CyWrD7YiEOXskbMuTRfkix0tRiDsPdztQlh9vL7K/8TKXHBEIOy9YlpKJ5sv+aLFxNpr1riKaOVFd77SXu6oxDuycs2Vr816gN/jFqRAWR1aBgAAAABJRU5ErkJggg==",
        iconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAADwUlEQVRoQ+2ZTWgdVRTHz5kJSLuQunAhhkqhVhulseiiQgtNGrALBSN558yECFo1SldKF62rtqtKF203QhvaRCQk996QJhIFA1a7KBRR6YdioZYuYgsFFy0uKiV5c8oNd2T6MpPMpAnNFQeG95g595z/b879vgieX+i5fvgfIM3g4OBgc1NT05sA0IKIawEgva3JlL1FxP7+GgTBGBHdWorsP1QGnOguRHwDANorCpoAgMnp6emvenp6blQs+6/5ogCUUhsB4F1EfAcAnlxscFfuLxH5AgAGoii6UtVXZQCl1HEn/LGcYD8BwDcics3eYRj+YW3q9fqziLje3R0isjWn7D0LEkXRR1UgKgEYY4yI1BoCTNg6PTMz810cx3+WCT46OvpUvV63INaXrX7Z6xwzbyvjx9qUBlBKXULETRnHVnhfrVb7umywPLuRkZHXkyTpbQCZYuZnyvgtBaC1lqwzRPyQiPrKBChro5Tah4iHsvbMvKC+BQ2MMb+JyAupY0R8hYh+KSusip3W2nbDY5lYZ4ioYz4f8wI01vkyX6SK4CLbbMZF5EgURXuKbAsBtNb7AeBApmAnM49XEWiM+cF2s0T0YsVyL4vIz5kyB5j5YJ6PXABjTIuInAeAx20hEfk0iqLPqoho+ACFAop8GmN6ReSEe/83Ir5KRL832ucCKKVOIuJ7zniMmd+qIt7aPiyA83EaADrdRzwVRdH7CwJorV8DgG8zDWkHEX3/KACMMe0iciYTeyczTz7QIzYK01rb7vED93yAmXdVFb9UGXB++u20xWnoZ+a0Zsw+mlOFst1mkiRb4jj+8VECKKW2IKJtj/a6yszPFWbAGLNORK7PkiFeJqLWxYhfygxYX8aYKyLyvP0fhuGGrq6u2TnWnAwYY94WkS/du8PMvHclAGitPweA3VZLEAS7arXaQC6A1vooAHxsXyZJ0hbH8dmVADA8PLw9CAI7ptjrGDN/UgRgh3E7nNspcGt3d/fllQAwNDS0KQzDS07LODPPdq1zqpDW+gIAvOTaQDMR3cwDcH18GbZ0JM+O6IXlikZbY8zTIpKu2i4y8+YigNsAsMYBrCaifxqjNU7uylCUtUHEs0TUlhNzlYjcdc/vMPMT/1kA76uQ943Y727U+4HM+6mE7Zq8nsxZAO+n094vaGwWvF5Sunbg96LetQV/t1XSiZLXG1sZCH+3FlMIrzd3Uwivt9eL2oR77scBRyYT/h4xZSD8PeTLrle9PWbNW6R7edBddrdhOe0WPCNbzuBL4dt7gPtaw9JPjVtHHQAAAABJRU5ErkJggg==",
        text: "发布"
    }, {
        selectIconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAELUlEQVRoQ+2ZT2gcdRTHP282UYslrf8CCbubhgaqraXiiuDNQKEeLOKhqVbxVNuDxuwkFbQnL+rBmN2NKDQ9Fiu1JxFFBLWiCIKNWkgUhSaZXbfEFlEMpEmz82QmyTabZHdnd2eSjeR3G+a97595b/783ggbfMkG18+mgfWu4GYFNkQFokl9HOUgQgyhBaUVyABp4HuUYVv5JNMrf3kxFB7QO0MGT6ryMMJeIAKEEbIoV4BvJMTHE93yZTm8ki0UTekxlGNArBwQMCLKmxOmvF8qti2hz6jwKrDHA+ZFhCGrR4aKxRY1EE3qh8AhDyTLQ07PzXEye0KuLT3R2q93NzTwBvB8FZhfWHHZv1reqgYiSf1T4J4qiNwUVX6WEEesl2TUOY4O6m7NcVaEfdViovxrmdK0PH+FgWhSfwHurZroZuIIBl3uoY1TTS8tU5JW4UI6Lp1LgwoMRBN6CnF73q81sgBUs/i8IGXIMuX44nHeQDSlMZQf/FIeKI7wkNUjFx2OmwYSmkToCZTYJ3BV3k2b8mKhgaSOATt84gga5g8rLuG8gXBCHzWEr4Jm9RPfVjozplxwWyiS0KdFOOsnQdBYqhxJm/LBvIGk9gn0B03qJ77CiXRc3t6wBkR5ecKUftdANKnPAmf8vEKBYynPWaacWazAAYHPAif1kUBtDqR75XPXwO7X9Jap7fwE3OcjR5BQM1tbaRrtktn8iyyS1JMCrwfJ6iP2OSsuTxW+yN7TO7jB16i7wajnNQPst+LybYEB92ZOaRfKuXpWr0pf2pSBRY0rP6dTehrlaJ2ayLdOUQPt/dqWa+BT596uMxMjEuLgRLc432z5teqOLDygew2D88CuejAhcElCHB7vll+X6ym6J96R0AdsOI/Qsa4mhB9tOJzpkd9X01FuKuFscpxKtK+TiWGUQ5Ypl4vxl53MtQ/qvpzyEUrbWppw20Z5YtyU8VK8ZQ24j9cB3YPhfmq4m4g1WKNzOR7L9okzOCu5PBlwENqTuiuHu+lpKQday3kRfrMNOtPdkvWC49mAAxYZ1J2S4zuEZi/gVcSMheCRsbhMes2tyIBbifn3hDMRuMsrice49NwWHsweL5zolcut2IBbiXe0VXI4M5/t5Qg8nr9i29zvdTi8FLMqAw7Azre0+UYjzrN5xbjPo+j5MOVawwwdl1+RfyrKWwiu2oCT74zJDQMLuL0acuDv6UYiV1+QqSrza/9H1jGoTbPKJMptFYqYsm2aM70yXWFeQXhNFVhECg/oFsPAaYFGT2KE61tb2ObsqDzFlwjyxYCDHzuljVenuQ4YZUTlrFZupUtytYp38n0zMH9DqkRSTBb9t+DO+NkGon6I99/Agqoif3eK/mWpxYy/FViixB3XQ0xtZlUYzsTlUi1Ci+UGZiAIsathbhpYqyv9v22h/wApaT5AcvyJYQAAAABJRU5ErkJggg==",
        iconPath: "data:image/png;base64,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",
        text: "收藏"
    }, {
        selectIconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAADxklEQVRoQ+2ZXWgcVRTHf2e66ZOISh6k6U60D1asYEGxghQUA0WqKEIpUlTatxbNzgRsi4hWoWBFMpMoQfDNxg/8eBE/asmDqAVpH7RiwQep2dkUocUWRbGoO0c2IeJHd8+9M7MJhc7r+Z//Ob9z9947wwoX+SMXef9cAljuFax8BYZe0uuCP7k+UAYVBkXQXDkTBJxut/libkzOVgldCcCqF3SwNsCDqjwgcEevBhXeCJQPmrG8VgVIaYDhRHeosBtY69nQEYTJrCFveeb9S14YoDP1gRqvKNxfpgHg3ZUBO74blZ+L+BQCGJrUm1Yoh1CuLlL0fznCZ0HOw7OxzPr6eQOsHtehIGDOt5ClV+V4PsBdpx6VHy3tP+PeAGGqXwLrfYp4aF/OItnpofe7yMJED7CwYfv5PJJF8qprAecVCBO9HeFzV+OiOoGv2zm3zY3Jby4e7gCpvglsdTEtrRH2ZA153sXHCaCe6iaBQy6GFWlO1c6z7uRe+cnycwIYTnW/whOWWZVxETY3G/Kh5ekEECb6KcJGy6zKuAj7mw150vJ0A0hVLaOq4wqftCK50/I1AeZf1GqcsYz6EP8hi2SV5WsCXJvq2jZ8axn1I147zxXWRjYBlur8v9AA8pwNc2NytNdwbIBJvYGcE/2YsOUpf7Cm+bh8Xwpg9bheFQR4vWBZjTnGf80iuczSmivQMQhT7Vwol1tmFcePZZHcanm6AnwDrLPMKo5PZ5E8ZHm6AST6PsJmy6zSuLAva8gzlqcTQD3VrQKdl7mletrBCm6cfUzM49sJYH4fJHoM4ZalIFB4vRXJNpda7gCpjgITLqZlNQr3tSJ5z8XHHWBKr+R3jgN1F+MSGqfTZ9HfGaCTMJzoNhWmSzRnpZ5DuTeL5YglLATQSaonulOEKdcCXjplSxbLOz45XiuwaBxO6G6UAz6FTK0ymsXyoqn7j6AQwPxKpBoLPAuY173R1C8KT7UiSXyb7+gLA3SSr0l0fS48B2wqUhz4OFD2zsbyVcH8cgB//6QSjRD8JqjEWSxp0cYLb+JuBUPPz84sklKrXxogXLgXRhR2Wf8JdIPufPcKTLGSmWyXnCuyGl5TCBNdQ8AIygiwpUjBHjlvI8yQM5PFctLV2wmgPq4bg4DtCttdjUvphIPaZro1Joctn54Aw4nerTLfdNXTtvpaiAuHyZnOYjnYLaErQDihT6Psc6vUZ1WPb4PuAJ6nSp8R6HZq9QK4B+Hmfjfm4i85R5uxfHQhrdMmdimyXJpLAMs1+dI38XI3vlj/L/VgEEAZZtRVAAAAAElFTkSuQmCC",
        iconPath: "data:image/png;base64,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",
        text: "我的"
    }]
}

tbs-tabBarInPage Events

属性说明： @tabBarCreateEvent事件的返回参数，tabBarHeight表示tabBar的高度(px)，pagesHeight表示当tabBar在底边时，整个页面剩余部分的高度(px)，也就是页面填充高度

基本用法

在调用组件的页面里编写如下代码： 在 template 中使用组件

<tbs-tabBarInPage :tabBar="tabBar" @tabBarChangeEvent="onTabBarChange" @tabBarCreateEvent="onTabBarCreate"></tbs-tabBarInPage>

在 script 的 data 中加入tabBar变量，表示当前页面传给组件的自定义tabBar数据

data(){
    return{
        selected: 0,
        tabBar: { //此处为tabBar属性的demo演示数据，当然你可以根据需要进行修改
            selected: 0, // 当前选择的tab的index序号
            color: "#7A7E83", // 非选择项的字体颜色
            selectedColor: "#3cc51f", // 选择项的字体颜色
            list: [{ // tabBar 里的item项目列表
                // 此处图标icon的路径可以有两种表示方式，一种是图片路径格式，另一种是采用base64格式
                // 图片路径格式必须要保证路径下的文件是存在的，演示如下：
                // selectIconPath: "/static/images/tabbar/home-a.png",
                // iconPath: "/static/images/tabbar/home.png",
                // 下面是demo数据，为了便于使用测试，使用base64格式加载icon
                selectIconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAADIUlEQVRoQ+2ZO2gTcRzHP7+r+Nh8DA4macVFVFRU3IRuLlYXnaSL+ChtbS7BQRSxQqFDtblWW/G16CK6iDrpIIh2URcfoHTyLkUcShfBpbmfJK01bdPcI7mYQm4L93t8P7/f//6vCMv8kWWunwZAqQ4mLD2EcBplP0IOeIfLgJ2St9XueHU70KtGYh0WytmSQpWUnRKrmhBVA2i5qlvdFeTFHSwrULjt5jCzafldDZCqAMQtPSwwBLT4FPVGXVJOWt77tF/SrGKA5oyeU2EghJBJhJSdlAchfOdcQgPEBnWNYRSqfqoSAQj9dlIuhI0RCmDTNd3VZHAd4UDYxMV+Ak9yLt3ZtEwEjRcYIGHpMeAmsCFoMg/7b2rQ4/TIiyBxAwHEM3pRhL4gCYLaKqQdUzJ+/XwBtGR0rWtwA+W438CV2Cncc5KcQkS94ngCxAZ1v2FwC9jtFazK78dcl45sWj6Vi1sWIDGk7Sh3gZVVFuc33JQKnU5SHi7lsCRAwtJ+4LzfTFHaKfQ5plwqlWMRwGZLN+aUOwhtUYoKGjs/1U6v4OREt0wumIL//WzJaKsrhSGzJWiCGtmPK5x0THn9N99cB+KWdgqM1EhIRWkUuhxTRvNBCgCxjLYawquKotbeuc025XkBIJHRdoT7sxoeA/nVtv4e4Rk6+20KZ+yk3C4eQiMifAXWo/TWn/rCeJnRpUzZpgzPDaFisYkhvVzPAHZSriw5CxWGUwMgwsEn9DY6EGF9vUM3OuBdo78WvxReipIVYVohVthbKav9hyhhWaMOjIly9HtKfsybnod1Gy6PgO2hIWoA8MU2ZUc5gQlL83dBe0NBRA2gMOqY0lVOXHxI74lyoi4B8kv9wnl6odCKFsqoO9AA8BpXjQ6EqFDjG5i/d454M1cXs9DM5W1+xQz+RA1Q4i+qRfdCm4Y11uTiBFdfdOTzcg55ZFU44pjytOyJrHAqq6NbuSKxH2xT9i2sjdfVYgpY5VXQGrz/qUqHk5InvgHyhs0Z3ePCTjForoHIkikExnPK56wpH0sZeF6v/y/hfvM2APxWKiq7Zd+BP2J+ZUCnohS9AAAAAElFTkSuQmCC",
                iconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAERElEQVRoQ+2ZTYhbVRTH/+cmDriRUheCCgoiOLpwBCm6ENwUF1rLMMm9L4QsNG1n7Fhm1Cp+gRGUilq02kH7IZR2SO694xBR6UZQV4robFqRYEVFF+LGCDLqzCTvyBuScJuPSV7mOWQgdxXeO/ec/++ce99974SwzQdtc/0YArSr4MLCwgO+7x8AsAtAFcCSEOJkMpn8OOqKR1qBXC4nRkdH3wRwqJ1QZj5eKpVmcrmcHxVIZAD5fP6WWCwWiL+vi7hPiGhWSvldFBCRABQKhQeFEMcA3OiIOkVEAdAqMz8FYL9z75caRHGzEJsGMMYcBvBak5DDSqmj7jWt9ZNE9Kp7jYiekVK+shmIvgGstVcyc5D1RmaJ6Eff92c8z2u7WbXWewEcI6Ib6qKJ6Ey5XJ6enJz8ux+QvgC01rcDeJuI7nGCnq9UKrPpdPrSRkJqe+UtALsduy8rlcqhdDq9FBYiNIDWOklE7wC42gn2hlLq8TDBjTHHAUw7c/4AMKOUmg/jJxSA1vo5InrJDcDMU57nnQgTtG6rtZ6pbfTGdCJ6WUr5fK/+egIoFos7VldXg4ylnbVbqlarj6RSqc97DdbOzlq72/f9OSK62fH9/tra2oF0Ol3u5rsrgLV2FzMHGR5zAhRXVlamM5nMb90C9HLfWnsdgBPMfL9jf1EIMZVMJr/YyMeGANbaDDOfBjDiODmilHq2F2FhbYwxrwN4wpm3SkQHpZTvdfLVEcBae4SZn65PZOY1IURWSnkurLAw9saYhwG8C+AKZ95RpVRw3rSMFoB8Pn9NLBY7BWCPI/5CPB7PJhKJb8KI6ddWa30XgNNEdJvj43w8Ht83MTFx2bK9DKBQKNwrhAiWzE2OeLO8vLw/m83+1a+gfubNz89fFY/HA4ikM/8nItonpfy0sR/rP7TWB4lorilYTin1Yj8CoppjjHkBQK7J36NKqXWt6xWoZf6zNkEHFQBCiD3B90UdICOEOLtORLTAzPWyDSwAEU1KKU829oAxZo6ZS0S00ynZoAHUl1JZKRW8T7V+EzetuYEDaN6TLY/RIUBUj5+an24JHVYg4oS3uBtWoN+T2Fp7K4C7fd//F8DXnud930+1trwCTleu8TJYE/5RP925LQWw1u5k5osAru2Q7Z9HRkbuGB8f/7PXamwpgNbaI6JC402R6Jzv+/8QUdAnXR++7z+USqXODCRAp2x1y+JGMN3mRnoODAHalGJYgTDnwHAJDZcQgFrz1tY+L7+SUgYtjp7G/7GErLVnmTkTCGDmxzzPC/40aYyWx+ji4uL1lUrlV8fmBwBhOsb1z77mTkKn692S0/BDRHullB9uCBDcNMYEbe+gmTtIY0kpdWezoI6tRa31LBEFPZkdA0DxO4AppdQHPQMEhtbasWq1OiaEaPwltNUwRHRJCPFtIpG40C521/b6VgsOG28IEDZjUdtv+wr8B8kwYU+OeseKAAAAAElFTkSuQmCC",
                text: "首页"
            }, {
                selectIconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAACmUlEQVRoQ+2YP2hTURSHv18yCQ5FtIK2zxZnF3EUsZPUinSpIEVqUcHF5mZwE2wHJ6V9HRwUxU5FdHCoWnCq1FV0qEK3vBdpBRHcBJEciVJJY5q+JC+SCw28JZxz+b537r93hOc/ec7PjkC9CvaHtr9kXDBxG7GGsQ4sZ4ypQl7f0qh+WysQhLYMHK8B+h64Fju9aVWibQJBaFeA+3UAv8sYifJ60YpEWwT23bXdu36ygnGoHpzBfNFptOMEekM7IXidBCxj9BfyKiSJrRXTlgoEs5bDCJNAmTFezGsuSez/FJjDGEsEJSbjnKYSxdYISr8CTywbrLEKHE4E1WkCvTM2LPEsEXw5qOMEQnsguOSlQN+MdZVgFdHtpUAwazcxJhPDl2eQuB7ldKeRnMrY1BZxENoZYKFREMtwqjihV43mbcSnItA7YxclHjUDETu1xNBSchkcMSY42Qw88DV22ttk7u+0TQJ/53DV1tbM3G4FqkbuW8RCrQNvs0BotpFcWdqg4v+UwRod7mnsdG7LRVwJ2qEC5V1rNMppvuYi9kHAYLHodNpbgTJ45ezwbQ2U+QuxU7+3FTBYKjoNeCsAzMVO4/4KVJ1R3q2B6k9Q7wRKxsCnvJa8nULVXQzvKlB9e/VNYNMZ8O9ttMMvc9VngHcCEreinG54exuVGIpyeumtwI8M3Z8n9MVXgZXY6Uj1F5BPu9C92OmqtwKCy5HTQ38FMhyNJvTOV4H12OlArQ6AH20VYyHO6+y2Ao32OILQRoCNp9H05PF1WvAtdeY2CHqm7WA2y3DJGBIMJifbPlLwOHI6v1VkKgKVg/dM256sGDRxTNBn0Mefp2t7XDAoH1QfgI+Cxdjpeb281AWSQKYZsyOQ5ttsZqxfr75fQF7akegAAAAASUVORK5CYII=",
                iconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAEPUlEQVRoQ+2ZXWhcRRTH/+dukieFIlJBBBuq+KC24kNBFLEI1i/EJeScexNjLVX0weqTiqjYPlgUffADpRbFILI7ZwLGULFWfYhEBAWxYC0KRdcXi4RC9cUQkjsycTbcbHez3eyG3AsdWFju3Z35/+acM2fmDKHgjQquHxcAVrNgpVK5rFQqjQF4FcCfAE4DmBkYGDhQLpfP9sL662oBVZ0BcEsToceJaB8zf9MtxLoBqOojAA6vIvDfKIp4eHj4024g1gXAWnsRgBPOuSuDuHeI6IU0TR8kohcBbArPj4jIfbkDUNVbAXwdhM329fVtHxoa8v6/1FT1DIBL/HciupaZT64VYr0s8KRz7nUvyjl3OI7jR7MCrbXWOTccAB5m5vdzBaCq4wB2B1FjIvJRVqCqejfaH57tF5EDuQGw1pacc78C2OpFLSwsbBkdHf0jK9AYs4+I3swlgKreD2AyuM9MHMc+HlY0Y8woEdWtki8LGGPeI6K9QfFBEXmuCcBdRPRZ7iwwOTm5aX5+3rvP5iDuThE51ghgrR1zzn2YO4CG4DwlIlc3C05VPQSgvjI9JSKvbXgQT0xM3Jum6ZGMkLdE5IkWAD8BuC7Eya44jr/YUIBqtfpQFEUfZETUiOgGZv67UZiq3gxgeQ8kIl3loq7+7IWXSqXdzrnbskKJaBsz+1k+p6nqKwCe9i+I6AwzX7rW2V/qI/vnjA+vWNoafLvleEQ0XSqVRrLbhiYW+AXANR2K/gGA3zedk/AaAVy946xpVXX5eYuBawDGzyejqurvALZ0CLD0cyKaYGZeYe0GC3QK8L1z7u04jutLYltdIV78VmKtEKPMXKkP1LEFug26toTN42Z570RER5n57kIBeLFZN85OYiEsYK0ddM79Fma9JiKDhbJAtVq9PYqir0IgTzPzzkIBZM/XRDTOzHuKBnAQwLNB9IocVYgYMMYYIhIPkKbpniRJ/Inv/9zQaR7YoGX0OwA7AsDOJEmmiwYwC2Bpz5Sm6WCSJD7zF8MCU1NTF8/Nzf1TF9zoAbl3IWPMdiI63iwHFCIGjDExEVWb5YBCAKjqywCeCQAvMfPz2YUn9y6kqp8D2BVE3yMi9WpGMYJYVf+qVzmIaDMz+xVpueXaAsaYrUR0Kqg9ISLXZ8XnPgastWXn3MdB9Lsi8lihALJncSJqWsXu2IUaZwDAocXFxTdGRkb8Yb2nTVX97JdDBr4xSZIfu7bAKgp9te2YiHzSKwpV9f7v4+A0M1/erN+ellXCAGeJ6Ms0Tb8lIl/gqvX399fO91bSWutvbq5K03SMiB4Pfba8iuqqsGWt3euc85Xom3o16y36aVmC7wqgPpiq+iPeAwDuAHBFj2GMiCSt+uwJQLbzSqWyLYqiHf7yLtR+fP3Hf+o3k+34ZonoZ+fcySiKjra7hu05QDt1vX5/AaDXM9ppf/8BjdUzT5WdwHQAAAAASUVORK5CYII=",
                text: "分类"
            }, {
                selectIconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAACp0lEQVRoQ+2ZvWsUURDAf3Mn2okW2mj2sFFMQLS0sFAEbYQIWgrxCwQhu4d/gPEfMJvYiKgJljZRbEwhWgiWKn6BgnjvThAsFDvB25G95MJG924/E+8FF5Zt5s3M783szPsQLH/Ecv/5D9CN4LZp3b4uYBRhWMEhfIPOFyoYwAiYIOBVdT1zny7KlzKiXygCodPVNicQjgGHMjmkPBCY/1Xl/udxaWUaGxHOBVCb1N0qnBYYU9iS13g4TuCrwqwoM426vMuqKzOA4+t1YAzYkNVYgvxPYNZ4ciGL3kwAjq93gZNZDOSQfWo8OZB2XGqAmq8vFfakVVxETsE0Paml0ZEKwPFV0ygrW8Z4kuhfooDj62tgpGznUup7ZDw53E+2L8Aq5XxfFhGuNly51EuoJ4AzpZdRJlLOVLxYhZGgzdaK8LiQHmHCuHIlTkcsgDOtwwQ8AzbmNhwxWsJk/KDCfjMub//0JxZgyNebAmdzO7/QoZZmrQQAFG41PTmXCDDk6xGBh4WcXwGAUKXC0aYn81Hf/oqA4+sN4PxAAgi3m64sy4w4gHLKZskp1Amq8L7hyq6eEahd0x3a5mPh2V+hFArVBsLOlisfuj4ui4AzpadQ7gwygApnmq7MxAP4Ogl4gwwA+MaTeixAzdc5hdFBBhC41/DkeK8IPAf2JgJIug7d7Z6dPpDmSdf5XxhP9vUC+AZs6mcrUA626vIkjT9ZZRZXAG8Sxn03nmxeswB2p9Ba+IntLqPWNzLrlxJhaSptD/wvFnOLAHYvp63f0IRRsHpL2Ukj2zf1HQibj1W6CyWrD7YiEOXskbMuTRfkix0tRiDsPdztQlh9vL7K/8TKXHBEIOy9YlpKJ5sv+aLFxNpr1riKaOVFd77SXu6oxDuycs2Vr816gN/jFqRAWR1aBgAAAABJRU5ErkJggg==",
                iconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAADwUlEQVRoQ+2ZTWgdVRTHz5kJSLuQunAhhkqhVhulseiiQgtNGrALBSN558yECFo1SldKF62rtqtKF203QhvaRCQk996QJhIFA1a7KBRR6YdioZYuYgsFFy0uKiV5c8oNd2T6MpPMpAnNFQeG95g595z/b879vgieX+i5fvgfIM3g4OBgc1NT05sA0IKIawEgva3JlL1FxP7+GgTBGBHdWorsP1QGnOguRHwDANorCpoAgMnp6emvenp6blQs+6/5ogCUUhsB4F1EfAcAnlxscFfuLxH5AgAGoii6UtVXZQCl1HEn/LGcYD8BwDcics3eYRj+YW3q9fqziLje3R0isjWn7D0LEkXRR1UgKgEYY4yI1BoCTNg6PTMz810cx3+WCT46OvpUvV63INaXrX7Z6xwzbyvjx9qUBlBKXULETRnHVnhfrVb7umywPLuRkZHXkyTpbQCZYuZnyvgtBaC1lqwzRPyQiPrKBChro5Tah4iHsvbMvKC+BQ2MMb+JyAupY0R8hYh+KSusip3W2nbDY5lYZ4ioYz4f8wI01vkyX6SK4CLbbMZF5EgURXuKbAsBtNb7AeBApmAnM49XEWiM+cF2s0T0YsVyL4vIz5kyB5j5YJ6PXABjTIuInAeAx20hEfk0iqLPqoho+ACFAop8GmN6ReSEe/83Ir5KRL832ucCKKVOIuJ7zniMmd+qIt7aPiyA83EaADrdRzwVRdH7CwJorV8DgG8zDWkHEX3/KACMMe0iciYTeyczTz7QIzYK01rb7vED93yAmXdVFb9UGXB++u20xWnoZ+a0Zsw+mlOFst1mkiRb4jj+8VECKKW2IKJtj/a6yszPFWbAGLNORK7PkiFeJqLWxYhfygxYX8aYKyLyvP0fhuGGrq6u2TnWnAwYY94WkS/du8PMvHclAGitPweA3VZLEAS7arXaQC6A1vooAHxsXyZJ0hbH8dmVADA8PLw9CAI7ptjrGDN/UgRgh3E7nNspcGt3d/fllQAwNDS0KQzDS07LODPPdq1zqpDW+gIAvOTaQDMR3cwDcH18GbZ0JM+O6IXlikZbY8zTIpKu2i4y8+YigNsAsMYBrCaifxqjNU7uylCUtUHEs0TUlhNzlYjcdc/vMPMT/1kA76uQ943Y727U+4HM+6mE7Zq8nsxZAO+n094vaGwWvF5Sunbg96LetQV/t1XSiZLXG1sZCH+3FlMIrzd3Uwivt9eL2oR77scBRyYT/h4xZSD8PeTLrle9PWbNW6R7edBddrdhOe0WPCNbzuBL4dt7gPtaw9JPjVtHHQAAAABJRU5ErkJggg==",
                text: "发布"
            }, {
                selectIconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAELUlEQVRoQ+2ZT2gcdRTHP282UYslrf8CCbubhgaqraXiiuDNQKEeLOKhqVbxVNuDxuwkFbQnL+rBmN2NKDQ9Fiu1JxFFBLWiCIKNWkgUhSaZXbfEFlEMpEmz82QmyTabZHdnd2eSjeR3G+a97595b/783ggbfMkG18+mgfWu4GYFNkQFokl9HOUgQgyhBaUVyABp4HuUYVv5JNMrf3kxFB7QO0MGT6ryMMJeIAKEEbIoV4BvJMTHE93yZTm8ki0UTekxlGNArBwQMCLKmxOmvF8qti2hz6jwKrDHA+ZFhCGrR4aKxRY1EE3qh8AhDyTLQ07PzXEye0KuLT3R2q93NzTwBvB8FZhfWHHZv1reqgYiSf1T4J4qiNwUVX6WEEesl2TUOY4O6m7NcVaEfdViovxrmdK0PH+FgWhSfwHurZroZuIIBl3uoY1TTS8tU5JW4UI6Lp1LgwoMRBN6CnF73q81sgBUs/i8IGXIMuX44nHeQDSlMZQf/FIeKI7wkNUjFx2OmwYSmkToCZTYJ3BV3k2b8mKhgaSOATt84gga5g8rLuG8gXBCHzWEr4Jm9RPfVjozplxwWyiS0KdFOOsnQdBYqhxJm/LBvIGk9gn0B03qJ77CiXRc3t6wBkR5ecKUftdANKnPAmf8vEKBYynPWaacWazAAYHPAif1kUBtDqR75XPXwO7X9Jap7fwE3OcjR5BQM1tbaRrtktn8iyyS1JMCrwfJ6iP2OSsuTxW+yN7TO7jB16i7wajnNQPst+LybYEB92ZOaRfKuXpWr0pf2pSBRY0rP6dTehrlaJ2ayLdOUQPt/dqWa+BT596uMxMjEuLgRLc432z5teqOLDygew2D88CuejAhcElCHB7vll+X6ym6J96R0AdsOI/Qsa4mhB9tOJzpkd9X01FuKuFscpxKtK+TiWGUQ5Ypl4vxl53MtQ/qvpzyEUrbWppw20Z5YtyU8VK8ZQ24j9cB3YPhfmq4m4g1WKNzOR7L9okzOCu5PBlwENqTuiuHu+lpKQday3kRfrMNOtPdkvWC49mAAxYZ1J2S4zuEZi/gVcSMheCRsbhMes2tyIBbifn3hDMRuMsrice49NwWHsweL5zolcut2IBbiXe0VXI4M5/t5Qg8nr9i29zvdTi8FLMqAw7Azre0+UYjzrN5xbjPo+j5MOVawwwdl1+RfyrKWwiu2oCT74zJDQMLuL0acuDv6UYiV1+QqSrza/9H1jGoTbPKJMptFYqYsm2aM70yXWFeQXhNFVhECg/oFsPAaYFGT2KE61tb2ObsqDzFlwjyxYCDHzuljVenuQ4YZUTlrFZupUtytYp38n0zMH9DqkRSTBb9t+DO+NkGon6I99/Agqoif3eK/mWpxYy/FViixB3XQ0xtZlUYzsTlUi1Ci+UGZiAIsathbhpYqyv9v22h/wApaT5AcvyJYQAAAABJRU5ErkJggg==",
                iconPath: "data:image/png;base64,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",
                text: "收藏"
            }, {
                selectIconPath: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAADxklEQVRoQ+2ZXWgcVRTHf2e66ZOISh6k6U60D1asYEGxghQUA0WqKEIpUlTatxbNzgRsi4hWoWBFMpMoQfDNxg/8eBE/asmDqAVpH7RiwQep2dkUocUWRbGoO0c2IeJHd8+9M7MJhc7r+Z//Ob9z9947wwoX+SMXef9cAljuFax8BYZe0uuCP7k+UAYVBkXQXDkTBJxut/libkzOVgldCcCqF3SwNsCDqjwgcEevBhXeCJQPmrG8VgVIaYDhRHeosBtY69nQEYTJrCFveeb9S14YoDP1gRqvKNxfpgHg3ZUBO74blZ+L+BQCGJrUm1Yoh1CuLlL0fznCZ0HOw7OxzPr6eQOsHtehIGDOt5ClV+V4PsBdpx6VHy3tP+PeAGGqXwLrfYp4aF/OItnpofe7yMJED7CwYfv5PJJF8qprAecVCBO9HeFzV+OiOoGv2zm3zY3Jby4e7gCpvglsdTEtrRH2ZA153sXHCaCe6iaBQy6GFWlO1c6z7uRe+cnycwIYTnW/whOWWZVxETY3G/Kh5ekEECb6KcJGy6zKuAj7mw150vJ0A0hVLaOq4wqftCK50/I1AeZf1GqcsYz6EP8hi2SV5WsCXJvq2jZ8axn1I147zxXWRjYBlur8v9AA8pwNc2NytNdwbIBJvYGcE/2YsOUpf7Cm+bh8Xwpg9bheFQR4vWBZjTnGf80iuczSmivQMQhT7Vwol1tmFcePZZHcanm6AnwDrLPMKo5PZ5E8ZHm6AST6PsJmy6zSuLAva8gzlqcTQD3VrQKdl7mletrBCm6cfUzM49sJYH4fJHoM4ZalIFB4vRXJNpda7gCpjgITLqZlNQr3tSJ5z8XHHWBKr+R3jgN1F+MSGqfTZ9HfGaCTMJzoNhWmSzRnpZ5DuTeL5YglLATQSaonulOEKdcCXjplSxbLOz45XiuwaBxO6G6UAz6FTK0ymsXyoqn7j6AQwPxKpBoLPAuY173R1C8KT7UiSXyb7+gLA3SSr0l0fS48B2wqUhz4OFD2zsbyVcH8cgB//6QSjRD8JqjEWSxp0cYLb+JuBUPPz84sklKrXxogXLgXRhR2Wf8JdIPufPcKTLGSmWyXnCuyGl5TCBNdQ8AIygiwpUjBHjlvI8yQM5PFctLV2wmgPq4bg4DtCttdjUvphIPaZro1Joctn54Aw4nerTLfdNXTtvpaiAuHyZnOYjnYLaErQDihT6Psc6vUZ1WPb4PuAJ6nSp8R6HZq9QK4B+Hmfjfm4i85R5uxfHQhrdMmdimyXJpLAMs1+dI38XI3vlj/L/VgEEAZZtRVAAAAAElFTkSuQmCC",
                iconPath: "data:image/png;base64,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",
                text: "我的"
            }]
        }
    }
}

在 script 的 methods 中编写事件方法代码

methods: {
    onTabBarChange(e) {
        this.selected = e.selected
        console.log('tab 改变了，当前 tab 的 index 为：', e.selected)
    },

    onTabBarCreate(e) {
        console.log('create', e)
    }
}