All Products
Search
Document Center

Mobile Platform as a Service:Page

Last Updated:May 14, 2021

Page is a Webview logical abstraction layer and also the root node for component mounting.

Code import

  1. import { Page } from '@ali/kylin-framework';

Page declaration structure

The API contained in a Page is declared in Page Interface and provides complete control capabilities of Vue instances. The following shows a simple Page usage. initOptions is responsible for processing additional Vue configuration options.

  1. import { Page } from '@ali/kylin-framework';
  2. import IndexComponent from './indexComponent.vue';
  3. class IndexPage extends Page {
  4. initOptions() {
  5. return {}
  6. }
  7. render(h) {
  8. return <IndexComponent></IndexComponent>
  9. }
  10. }
  11. new IndexPage('#app');

Page Interface

This section describes the page API, including namespace.

Namespace

ES6 import method:

  1. import { Page } from '@ali/kylin-framework';

API

Currently, Page provides the following member methods for derivation:

  • initOptions
  • render

initOptions

  1. function initOptions(): VueOptions

Return value

The return result must be a valid Vue input parameter. Generally, we do not recommend that you introduce complex configuration to the Page layer. Involved logic can be maintained in Component.

render

The function must be a valid render function of Vue.

  1. function render(): VNode

Return value

The return result must be a valid VNode element. Write according to JSX specifications.