小程序自定义tab-bar报错
发布于 6 年前 作者 taoye 13062 次浏览 来自 问答

- 当前 Bug 的表现(可附上截图)

- 预期表现

不报红

  • 复现路径
  • 提供一个最简复现 Demo

Component({

    data: {

        selected: 0,

        color: “#333333”,

        backgroundColor: “#fbfbfb”,

        selectedColor: “#4bc4f7”,

        borderStyle: “white”,

        list: [{

                “pagePath”: “/pages/index/index”,

                “iconPath”: “/static/img/index.png”,

                “selectedIconPath”: “/static/img/sindex.png”,

                “text”: “首页”

           }, {

                “pagePath”: “/pages/serve/serve”,

                “iconPath”: “/static/img/serve.png”,

                “selectedIconPath”: “/static/img/sserve.png”,

                “text”: “服务”

            }, {

                “pagePath”: “/pages/my/my”,

                “iconPath”: “/static/img/mmy.png”,

                “selectedIconPath”: “/static/img/smmy.png”,

                “text”: “我的”

        }]

},

attached() {

},

methods: {

    switchTab(e) {

            var _this=this

            const data = e.currentTarget.dataset

            console.log(data)

            const url = data.path

                    wx.switchTab({

                                url

                                    })

        _this.setData({

            selected: data.index

                    })

                }

        }

})

这是tab-bar组件的js部分

__
__

<cover-view class=“tab-bar”>

        <cover-view wx:for="{{list}}" wx:key="{{index}}" class=“tab-bar-item” data-path="{{item.pagePath}}" data-index="{{index}}" bindtap=“switchTab”>

                    <cover-image src="{{selected === index ? item.selectedIconPath : item.iconPath}}"></cover-image>

                    <cover-view style=“color: {{selected === index ? selectedColor : color}}”>{{item.text}}</cover-view>

        </cover-view>

</cover-view>

这是wxml部分

__
__

分别在三个tab的onShow生命周期中添加了

if (typeof this.getTabBar === “function” && this.getTabBar()) {

        this.getTabBar().setData({

                    selected: 0

                    })

}

__
__

2 回复

点击任何一个页面都会出现这三个错,但是数据没发现影响,只出现一次

回到顶部