TabbarItem标题下方的文字激活时的颜色为绿色，能否提供props供开发者自定义？

[Hfengxiang]

按照官方文档写的tabbar底部栏，由于项目主题色为红色，但是下方的文字激活时为绿色，目前通过覆盖样式临时处理，官方能否提供props供开发者修改?另外在真机上，文字下方有下划线，这个如何去掉？

` <tabbar-item :selected="this.$route.path === '/personalHome/selfOrder/'" @on-item-click="onItemClick(0)">

    <img slot="icon-active" src="../../assets/img/order_active.png">
    <span slot="label">本人预约</span>
  </tabbar-item>
  <tabbar-item  :selected="this.$route.path === '/personalHome/otherOrder/'" @on-item-click="onItemClick(1)">
    <img slot="icon" src="../../assets/img/helpOrder.png">
    <img slot="icon-active" src="../../assets/img/helpOrder_active.png">
    <span slot="label">帮人预约</span>
  </tabbar-item>
  <tabbar-item :selected="this.$route.path === '/personalHome/shareLink'" @on-item-click="onItemClick(2)">
    <img slot="icon" src="../../assets/img/share.png" >
    <img slot="icon-active" src="../../assets/img/share_active.png">
    <span slot="label">分享链接</span>
  </tabbar-item>
  <tabbar-item  :selected="this.$route.path === '/personalHome/questionnaire/'" @on-item-click="onItemClick(3)">
    <img slot="icon" src="../../assets/img/gift.png">
    <img slot="icon-active" src="../../assets/img/gift_active.png">
    <span slot="label">有奖问答</span>
  </tabbar-item>`

[zhump]

自己样式去覆盖

[airyland]

1. 用 less-theme 插件来覆盖变量 @tabbar-text-active-color
2. 确定你有按照文档引入 reset.less? 如果有，decoration 已经置为 none 不会有下划线。

[chobitsX]

好吧,竟然没一个完整作答的,那我给答复下, 方便后入者排坑:

• 打开文件build/webpack.base.conf.js, 找到modeule.exports = vuxLoader, 修改如下(并保存)

  module.exports = vuxLoader.merge(webpackConfig, {
  plugins: ['vux-ui', 'progress-bar', 'duplicate-style', {name: 'less-theme', path: 'src/style/vux_theme.less'}]
  })

• 新建文件src/style/vux_theme.less, 然后打开该文件vux_theme.less,添加代码(后面用到的其它vux样式变量也可以直接在此文件中添加)

  @tabbar-text-active-color: red;

• 运行npm run dev重启项目(目的是为了vux_theme.less文件被装在在vux系统中), 仅第一次需要, 以后不需要该重启操作

[guanbiao33]

@chobits4 给力了我的铁

[lqzo]

@chobits4 多谢大佬的分享

[Rain-Q]

@chobits4 给力了,膜拜大佬

[w316431585]

@chobits4 大佬现在vue-cli3.0以上版本没有webpack.base.conf.js，现在要怎么改呢？