This is actually a bug that has been fixed in Onsen UI but not released yet (https://github.com/OnsenUI/OnsenUI/pull/2595). There should be a release with the fix in a week or so.

If you need the fix right now then clone Onsen UI from GitHub and build it locally. There are instructions here: https://github.com/OnsenUI/OnsenUI/blob/master/CONTRIBUTING.md#development-setup. Once it’s built you can use npm link to use the local version of Onsen UI in your project.

I hope this helps resolve your problem. If you get stuck please let us know.

In your renderPage function, do you assign a key to the page that is returned? If the key prop isn’t set, resetPage would almost definitely break the application.

Please let me know if you are setting key. I’m trying to fix this bug and if you haven’t set key then I think that must be the problem.

Never mind, I just figured it out from the image you posted on Discord.

The problem is that ActionSheet by itself doesn’t have any kind of background, so it will literally just show the child elements. Usually the child elements are ActionSheetButtons which have a proper background. You can see an example here: https://onsen.io/playground/?framework=react&category=reference&module=action-sheet

Since you have img elements in your ActionSheet it will just show the images as they are with no background. You could add styling to the child elements if you still just want to use img.

By the way, SpeedDial might be more suitable if you want open a series of icons. https://onsen.io/playground/?framework=react&category=reference&module=speed-dial

I had a look at your code and I can’t see anything obvious that would be causing the problem.

Can you please post a working version of the code somewhere so I can run it (on codepen or github or whatever)?

Also, it looks like your syntax for defining methods in App might be wrong e.g.:

  _modalHandler = (name) => {

should be

  _modalHandler(name) {

I’m not too sure what you mean by a fullscreen welcome page. Do you have an example of what kind of thing you want?

Pages are defined using <ons-page>. There’s a tutorial on using pages: https://onsen.io/playground/?framework=vanilla&category=reference&module=page It’s possible to conditionally load a page when the app is started if that’s what you want.

Looks like this is a legitimate bug. I’ve opened an issue on GitHub https://github.com/OnsenUI/OnsenUI/issues/2594.
Hopefully we can get this fixed soon.

emccorson created this issue in OnsenUI/OnsenUI

open React | Navigator issue: resetPage causes screen to go blank #2594

That’s probably because you have var="s" instead of id="s". But there should have been an error in the console first, right?

To change whether the checkbox is checked, you need to set the checked property, not value.

Here’s an example:
https://codepen.io/anon/pen/bQzBXg?&editable=true&editors=101#anon-login

Does this solve your problem?

There is no colour picker included with Onsen UI, and I haven’t heard of anyone using one so far.

That being said, Onsen UI is just HTML web components so anything you would use in a normal web app should also work with Onsen UI.

Sorry I couldn’t recommend you a specific one. If you find a colour picker you like, please post it here so we can point other users towards it!

I can’t find any examples right now but here is the guide that tells you how to split out to multiple HTML files https://onsen.io/v2/guide/fundamentals.html#managing-pages

Where is the link that 404’d?