OnsenUI with VUE vue-onsenui v-ons-segment not working. Why?

Question

OnsenUI with VUE vue-onsenui v-ons-segment is not showing correctly, and instead of a button bar in a row, I'm getting standard buttons.

The code is in a modified Monaca CLI project with the minimal VUE template, inside a .vue file: in page2.vue, and I also tried replacing the code in App.vue with the same result.

The code is:

<p style="text-align: center">This is the second page</p>
<v-ons-segment>
  <button>hi</button>
  <button>bye</button>
  <button>try</button>
</v-ons-segment>
<p style="text-align: center">and hello again</p>

According to the documentation, it should look like this: https://onsen.io/v2/api/vue/v-ons-segment.html

Here's a screenshot of the result I'm getting:

The toolbar on the top is a v-ons-toolbar with v-ons-back button so vue-onsenui is available.

Why is it not working?

I'm using Monaca 2.4.1
Node: 8.5.0
NPM: 5.4.2
vue-onsenui: 2.0.0

Answer 1

Simply upgrade onsenui and vue-onsenui dependencies to the latest version. Changelog here.