So we have the same basic problem in multiple parts of our app. Most of the time our scrolling works just fine, but there are two specific times when we can’t seem to get scrolling to work. One example is below.

<ons-modal direction="up" id="termsConditionsModal">
	<terms-and-conditions-widget></terms-and-conditions-widget>
</ons-modal>

the content inside of the modal is pretty straight forward, just some headers and a bunch of text. We’ve tried with it wrapped in a div and without since the ons-modal throws a div in there. The style is below.

 .modal__content {
        display: flex;
        flex-direction: column;
        max-height: 100%;
        overflow-y: scroll;
        margin-left: 5%;
        margin-right: 5%;
    }

We’ve also thrown in variations of webkit-overflow-scrolling but we still can’t get it to work on iOS. Browser works fine, Android works fine, but iOS will be the death of me.

Help me Obe Wan Kanobi.

On the splash page of our app we have a dialogue like interface where the user is answering a few questions. As the questions get answers, they end up extending past the screen below. What is the best way as we add items to an ons-list that it automatically scrolls up to follow the conversation. We are using vue, and out template currently looks like below:

<template>
     	<ons-list modifier="material">
           <ons-list-item modifier="nodivider leftBubble" v-for="message in messages">
			<p>{{ message.text }}</p>
	     </ons-list-item>
     	</ons-list>
	<ons-bottom-toolbar>	 
			<input id="mainInput" v-model="newMessage" v-on:change="processMessage"  placeholder="Type your answer here...">	
	</ons-bottom-toolbar>
</template>

Having some issues getting my environment setup. I’m using cordova as a base, with vue, onsen ui components, and the vue-onsen bindings. I can get it to run as ios and android, it works when I just use a single vue component, but when I add in vue-onsen and onsen ui it get thrown some errors. I’m using Browserify as well. Below is my main.js where I am thinking the problem may lie. Would love some help, and I’m pretty new to all of this. Thanks!

UPDATE - Solved

var Vue = require('vue');
var VueOnsen = require('vue-onsenui');
var ons = require('onsenui');
var MainPage = require('./MainPage.vue');
var SecondPage = require('./SecondPage.vue');
var App = require('./App.vue');

Vue.use(Onsenui);
Vue.use(VueOnsen, {
  components: {
    MainPage,
    SecondPage
  }
});

ons.ready(() => {
  new Vue({
    el: 'body',
    components: { App }
  });
});