Problem rendering Toolbar on Navigator



  • Hello! I’m new to React and to Onsen UI, I trying to use this code render a Toolbar on Page inside a Navigator element, but I only can see rendered the Button and the Hello World div. can anyone tell me what I’m doing wrong?.

    import React from ‘react’;
    import ReactDOM from ‘react-dom’;
    var ons = require(‘onsenui’);
    var Ons = require(‘react-onsenui’);

    export default class App extends React.Component {

    renderToolbar() {
    return (
    <Ons.Toolbar>
    <div className=‘center’>Onsen UI</div>
    </Ons.Toolbar>
    );
    }

    renderPage(){
    return (
    <Ons.Page renderToolbar={this.renderToolbar}>
    <div>
    Hello World!
    </div>
    <Ons.Button>
    Push Page
    </Ons.Button>
    </Ons.Page>
    );
    }

    render() {
    return (
    <Ons.Navigator
    swipeable
    renderPage={this.renderPage}
    initialRoute={{
    title: ‘First page’
    }}
    />
    );
    }

    }