jason-vue-app

移动端布局组件 Demo

功能

1. App.vue / 页面组件.vue 自动初始化（调用 init 方法）
2. 初始化时，显示 loading 状态，若 reject 则显示 error 状态（init 方法是一个返回 promise 的方法）

说明

jason-app 组件是作为项目根组件使用
jason-app-page 组件是作为页面根组件使用

jason-app 布局

使用

npm i --save jason-vue-app

import jasonApp from 'jason-vue-app';
import 'jason-vue-app/dist/jason-vue-app.css';
 
Vue.use(jasonApp);

<!-- App.vue -->
<jason-app>
  <header slot="header">
  ...
  <footer slot="footer">
</jasn-app>

<!-- 页面组件.vue -->
<jason-app-page>
  ...
</jason-app-page>

props

jason-app 组件 和 jason-app-page 组件相同

name	description
loadingComp	自定义 loading 组件
errorComp	自定义 error 组件

slot

default app 和 page 都有，以下是 app 组件独有 slot

name	description
header	显示在内容之前的 header
footer	显示在内容之后的 footer

methods

jason-app 组件 和 jason-app-page 组件相同

name	description
showLoading	手动显示 loading 状态
hideLoading	手动显示 error 状态
showError	手动显示 loading 状态
hideError	手动显示 error 状态