taro转百度小程序componentProto报错

[puerilexy]

问题描述
taro转百度小程序自定义tabbar未生效

复现步骤
[复现问题的步骤]

1. 创建一个新的工程
2. src下创建文件夹custom-tab-bar
3. 在app.js配置项tabBar中配置custom:true
4. 在需要引用自定义tabbar的页面中配置usingComponent: {}

 config = {
    pages: [
      'pages/index/index',
      'pages/user/user'
    ],
    window: {
      backgroundTextStyle: 'light',
      navigationBarBackgroundColor: '#fff',
      navigationBarTitleText: 'WeChat',
      navigationBarTextStyle: 'black'
    },
    tabBar: {
      color: "#666",
      selectedColor: "#ed6c00",
      backgroundColor: "#fafafa",
      borderStyle: 'black',
      custom: true,
      list: [{
        pagePath: "pages/index/index",
        iconPath: "./assets/tab-bar/home.png",
        selectedIconPath: "./assets/tab-bar/home-active.png",
        text: "主页"
      }, {
        pagePath: "pages/user/user",
        iconPath: "./assets/tab-bar/user.png",
        selectedIconPath: "./assets/tab-bar/user-active.png",
        text: "我的"
      }]
    }

custom-tab-bar/index.js

class customTabBar extends Component {
  state = {
    selected: 0,
    color: '#666',
    selectedColor: '#ed6c00',
    list: [
      {
        pagePath: '/pages/index/index',
        iconPath: homeIcon,
        selectedIconPath: homeActiveIcon,
        text: '主页'
      },
      {
        pagePath: '/pages/user/user',
        iconPath: userIcon,
        selectedIconPath: userActiveIcon,
        text: '我的'
      }
    ]
  }
  switchTab = (item) => {
    const url = item.pagePath
    Taro.switchTab({ url })
  }
  goToIntellect = () => {}

  // 自定义 tabBar的页面
  render() {
      return (
          <CoverView className='tab-bar' style={{height: '120px'}}>
              <CoverView className='tab-bar-wrap' style={{height: '100px'}}>
                {
                  this.state.list.map((item, index) => {
                    return <CoverView className='tab-bar-wrap-item'
                      style={{marginRight: index === 0 ? '60px' : 0}}
                      data-path={item.pagePath}
                      onClick={this.switchTab.bind(this, item)}
                      key={index}
                    >
                      <CoverImage className='tab-bar-wrap-item-icon' src={this.state.selected === index ? item.selectedIconPath : item.iconPath} />
                      <Button className='tab-bar-wrap-item-btn' style={{color: this.state.selected === index ? this.state.selectedColor : this.state.color}}>
                          {item.text}
                      </Button>
                    </CoverView>
                  })
                }
              </CoverView>
              <Button className='tab-bar-intellect-btn' style={{bottom: '38px'}} hoverClass='none' open-type='getUserInfo' onGetUserInfo={this.goToIntellect}>
                <CoverImage className='intellect-icon' src={intellect}></CoverImage>
              </Button>
          </CoverView>
      )
  }
}
export default customTabBar

// 提供完整可复现的代码和整理好代码格式，有助于我们快速定位问题，节省你我时间。
// 代码提供不全或代码格式混乱的 issues 【有可能被忽略】，烦请各位注意。

**期望行为**
显示自定义tabbar

**报错信息**

[这里请贴上你的**完整**报错截图或文字]

**系统信息**
> Taro v1.2 及以上版本已添加 `taro info` 命令，方便大家查看系统及依赖信息，运行该命令后将结果贴下面即可。

 Taro CLI 1.3.10 environment info:
    System:
      OS: macOS High Sierra 10.13.6
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 11.12.0 - /usr/local/bin/node
      npm: 6.7.0 - /usr/local/bin/npm
    npmPackages:
      @tarojs/components: 1.3.10 => 1.3.10 
      @tarojs/plugin-babel: 1.3.10 => 1.3.10 
      @tarojs/plugin-csso: 1.3.10 => 1.3.10 
      @tarojs/plugin-sass: 1.3.10 => 1.3.10 
      @tarojs/plugin-uglifyjs: 1.3.10 => 1.3.10 
      @tarojs/router: 1.3.10 => 1.3.10 
      @tarojs/taro: 1.3.10 => 1.3.10 
      @tarojs/taro-alipay: 1.3.10 => 1.3.10 
      @tarojs/taro-h5: 1.3.10 => 1.3.10 
      @tarojs/taro-qq: 1.3.10 => 1.3.10 
      @tarojs/taro-quickapp: 1.3.10 => 1.3.10 
      @tarojs/taro-swan: 1.3.10 => 1.3.10 
      @tarojs/taro-tt: 1.3.10 => 1.3.10 
      @tarojs/taro-weapp: 1.3.10 => 1.3.10 
      @tarojs/webpack-runner: 1.3.10 => 1.3.10 
      eslint-config-taro: 1.3.10 => 1.3.10 
      eslint-plugin-taro: 1.3.10 => 1.3.10 
      nerv-devtools: ^1.4.0 => 1.4.4 
      nervjs: ^1.4.0 => 1.4.4 
      stylelint-config-taro-rn: 1.3.10 => 1.3.10 
      stylelint-taro-rn: 1.3.10 => 1.3.10 

**补充信息**
[可选]
[根据你的调查研究，出现这个问题的原因可能在哪里？]

[taro-bot]

欢迎提交 Issue~

如果你提交的是 bug 报告，请务必遵循 Issue 模板的规范，尽量用简洁的语言描述你的问题，最好能提供一个稳定简单的复现。🙏🙏🙏

如果你的信息提供过于模糊或不足，或者已经其他 issue 已经存在相关内容，你的 issue 有可能会被关闭。

Good luck and happy coding~

[Chen-jj]

@puerilexy 整理一下代码格式。

[puerilexy]

@Chen-jj 整理好了，不好意思。刚开始不太会用。

[Chen-jj]

@puerilexy 百度支持自定义 tabbar？？文档找不到。社区看到这个https://smartprogram.baidu.com/forum/topic/show/69733

[taro-bot]

Hello~

您的问题楼上已经有了确切的回答，如果没有更多的问题这个 issue 将在 15 天后被自动关闭。

如果您在这 15 天中更新更多信息自动关闭的流程会自动取消，如有其他问题也可以发起新的 Issue。

Good luck and happy coding~