taro-ui 的Tabs标签 加上scroll属性在微信小程序运行报错,可以滑动无法点击切换。



  • 1.在微信小程序开发者工具运行报错!正常使用是没问题的,一旦加上scroll属性就报错,图1第一个报错是运行时候报的错,第二个是点击切换是报的。请各位大哥大姐帮忙
    图1
    8909ce00-4903-419f-af7e-6f2fd9e5960e-image.png
    2.图2是小程序界面
    图2
    aaa4a787-77ba-466c-bbe7-6bb0a8b627fc-image.png
    3.下面是代码,完全按照官方文档写的。

    import Taro, { Component } from '@tarojs/taro'
    import { View, Button, Text, Image } from '@tarojs/components'
    import { connect } from '@tarojs/redux'
    
    import { add, minus, asyncAdd } from '../../actions/counter'
    import { AtTabs, AtTabsPane } from 'taro-ui'
    
    import './wash.less'
    
    import vipCardPng from '../../images/c_huiyuanka@2x.png'
    import addressPng from '../../images/c_dizhi@2x.png'
    import questionPng from '../../images/c_wenti@2x.png'
    import servicePng from '../../images/c_liucheng@2x.png'
    import ideaPng from '../../images/c_fankui@2x.png'
    import customerServicePng from '../../images/c_kefu@2x.png'
    import rightArrowPng from '../../images/c_wode_you@2x.png'
    
    
    @connect(({ counter }) => ({
        counter
    }), (dispatch) => ({
        add() {
            dispatch(add())
        },
        dec() {
            dispatch(minus())
        },
        asyncAdd() {
            dispatch(asyncAdd())
        }
    }))
    class Wash extends Component {
        constructor() {
            super(...arguments)
            this.state = {
                current: 0,
            }
        }
        handleClick(value) {
            // this.setState({
            //     current: value
            // })
        }
        config = {
            navigationBarTitleText: '专业洗护',
            backgroundColor: '#F5F5F5'
        }
    
        componentWillReceiveProps(nextProps) {
            console.log(this.props, nextProps)
        }
    
        componentWillUnmount() { }
    
        componentDidShow() { }
    
        componentDidHide() { }
    
        toPage() {
            Taro.navigateTo({
                url: '/pages/index/index',
            })
        }
    
        render() {
            const tabList = [
                { title: '标签页1' },
                { title: '标签页2' },
                { title: '标签页3' },
                { title: '标签页4' },
                { title: '标签页5' },
                { title: '标签页6' }
            ]
            return (
                <AtTabs 
                current={this.state.current} 
                swipeable={false}
                tabList={tabList} 
                scroll
                onClick={this.handleClick.bind(this)}>
                    <AtTabsPane current={this.state.current} index={0}>
                    </AtTabsPane>
                </AtTabs>
    
            )
        }
    }
    
    export default Wash
    
    


  • 求回复


登录后回复