this.$f7 is undefined

[opichon]

Inside the app component, this.$f7 appears to be undefined.

I am using the loginc from the app-component.md docs, namely adding thisto app.vue:

<script>
  export default {
    mounted: function () {
      this.$f7.alert('App is mounted!')
    }
  }
</script>

In the browser, the following error is reported:

vue.common.js:525 TypeError: Cannot read property 'alert' of undefined
    at VueComponent.mounted (app.vue:40)

If instead I just do console.log(this) then I can see that there is no $f7 property.

[jrpereirajr]

Same here, just this.$f7Router is available.

After some readings, I found this way in order to work:

<script>
export default {
	mounted: function () {
		// this.$f7.alert('App is mounted!')
		setTimeout(function(){
			window.f7.alert('App is mounted!')
		}, 100);
	}
}
</script>

But I think this isn't the right way to handle this... :)

[scriptPilot]

@opichonm @jrpereirajr - Documentation is updated, thanks - please follow Framework7 way of working:

methods: {
  onF7Init: function () {
    this.$f7.alert('App is mounted!')        
  }
}