为什么 Onsen UI 会抛出错误？答案

【问题标题】：Why does Onsen UI throw me errors?为什么 Onsen UI 会抛出错误？
【发布时间】：2019-06-13 12:00:30
【问题描述】：

我正在使用带有 react-onsenui 绑定的 React 和 Onsen UI 构建 PWA。我尝试使用 Onsen UI 网站上显示的官方示例来适应 Tabbar。我现在的代码看起来像这样（很简单）：

import React, { Component } from 'react';
import { Page, Tabbar, Tab } from 'react-onsenui';

import 'onsenui/css/onsenui.css';
import 'onsenui/css/onsen-css-components.css';

import ScreenOne from './screenOne';
import ScreenTwo from './screenTwo';

class App extends Component {

  state = {
    index: 0,
  }

  render() {
    return (
      <Page>
        <Tabbar
          onPreChange={({index}) => this.setState({index})}
          onPostChange={() => console.log('postChange')}
          onReactive={() => console.log('postChange')}
          position='bottom'
          index={this.state.index}
          renderTabs={(activeIndex, tabbar) => [
            {
              content: <ScreenOne key="Home" title="Home" active={activeIndex === 0} tabbar={tabbar} />,
              tab: <Tab key="Home" label="Home" icon="md-home" />
            },
            {
              content: <ScreenTwo key="Settings" title="Settings" active={activeIndex === 1} tabbar={tabbar} />,
              tab: <Tab key="Settings"  label="Settings" icon="md-settings" />
            }]
          }
        />
      </Page>
    );
  }
}

export default App;

但是它不起作用。我可以单击一次选项卡，仅此而已。控制台向我抛出错误。

在初始页面加载时

Uncaught TypeError: el._show is not a function
    at onsenui.js:31327
    at run (setImmediate.js:48)
    at runIfPresent (setImmediate.js:83)
    at onGlobalMessage (setImmediate.js:125)

在标签上点击

onsenui.js:31057 Uncaught (in promise) TypeError: prevTab.pageElement._hide is not a function
    at HTMLElement._onPreChange (onsenui.js:31057)
    at Swiper._changeTo (onsenui.js:15695)
    at Swiper.setActiveIndex (onsenui.js:15479)
    at onsenui.js:31233

我现在完全被困住了。谢谢帮忙。

【问题讨论】：

标签： reactjs onsen-ui onsen-ui2

【解决方案1】：

您能发布您的 ScreenOne 和 ScreenTwo 组件吗？检查这两个组件是否被'Page'标签包裹

【讨论】：