Question

vue的mint-ui中tabbar是用什么逻辑切换样式的为什么我切换不了？

<mt-tabbar v-model="selected" fixed>
<mt-tab-item id="首页">
<img slot="icon" src="./img/home/banner_img_1.jpg"> 首页
</mt-tab-item>
<mt-tab-item id="分类">
<img slot="icon" src="./img/home/banner_img_1.jpg"> 分类
</mt-tab-item>
<mt-tab-item id="购物车">
<img slot="icon" src="./img/home/banner_img_1.jpg"> 购物车
</mt-tab-item>
<mt-tab-item id="我的">
<img slot="icon" src="./img/home/banner_img_1.jpg"> 我的
</mt-tab-item>
</mt-tabbar>
删除了mt-tab-item中的id名之后就会出现选中效果，但是点击是没有用的，或者说怎么样才可以用他这个已经写好的切换样式？

Answer 1

// 点击了ItemclickTabBarItem() { // // 打印组件 // console.log(this.refs.pullList); // // 打印偏移量 // console.log(this.refs.pullList.scroll.scrollProperties.offset); let PullList = this.refs.pullList; if (PullList.scroll.scrollProperties.offset > 0) { // 不在顶部 // 一键置顶 PullList.scrollTo({y:0}); }else { // 在顶部 // 执行下拉刷新动画 PullList.state.pullPan = new Animated.ValueXY({x: 0, y: this.topIndicatorHeight * -1}); // 加载最新数据 this.loadData(); // 关闭动画 setTimeout(() => { PullList.resetDefaultXYHandler(); },1000); }}

2.关闭筛选菜单滑动手势
那这边我们的筛选菜单还有个问题，就是可以响应我们的手势进行滚动，这样肯定是不对的，那么我们需要关闭这个手势的监听，使这个菜单不能滚动，具体操作如下：
GDCommunalSiftMenu.js

12345678910111213141516171819
render() { return( <TouchableOpacity onPress={() => this.popToHome(false)} activeOpacity={1} // 不透明 > <View style={styles.container}> {/* 菜单内容 */} <ListView scrollEnabled={false} // 设置禁止滚动 dataSource={this.state.dataSource} // 设置数据源 renderRow={this.renderRow.bind(this)} // 根据数据初始化 Cell contentContainerStyle={styles.contentViewStyle} // 内容样式 initialListSize={16} // 一次性渲染几行数据 /> </View> </TouchableOpacity> )}

Answer 2

点击的时候会给selected进行赋值，也就将id值赋给selected，根据selected的值为点击的那个添加一个is-selected样式，你可以更改这个样式，或者绑定一个点击事件判断selected的值，添加样式，原理是一样的

Answer 3

我用你的代码试是有选中效果的