xaf-virtual-routes v1.1.6

Xaf Virtual Pages (Routes)

Работают с использованием:

• Provide & Inject
• WAAPI

Installation / Установка

• yarn add xaf-virtual-routes

import { createApp } from 'vue'
import App from './App.vue'
import 'xaf-virtual-routes/css'

const app = createApp(App)
app.mount('#app')

How to use? / Как использовать?

import { useController, useEmitter } from 'xaf-virtual-routes'
// Использование controller'а внутри виртуальной страницы
/*
 * inject доступен только в scope'е <virtual-controller>
 * controller имеет:
 * show(name) - показать virtual-page по её имени
 * hide(name) - скрыть virtual-page по её имени
 * back() - вернуться к предыдущей виртуальной странице
 */
const controller = useController()
/*
 * Нужен чтобы слушать ивенты виртуальной страницы в виде:
 * - didShow
 * - show
 * - hide
 * - didHide
 */
const emitter = useEmitter()

const vControllerRef = ref(null)
const openChatRoom = () => {
  vControllerRef.value.show('chat-room')
  // vControllerRef.value.hide('chat-room')
  // vControllerRef.value.back()
}
return {
  vControllerRef,
  openChatRoom,
}

<template>
  <virtual-controller ref="vControllerRef">
    <virtual-page name="chat-room">
      <chat-room />
    </virtual-page>
    <!-- virtual-pages -->
  </virtual-controller>
</template>

TODO:

• Защита от двойной инициализации virtual-controller'а: если кто-то будет пытаться использовать nested-routes неправильно ( пытаться создать экземпляр компонента virtual-controller заново внутри уже имеющегося virtual-controller ) - бить по рукам ошибкой
• Events:
  • didHide ( закрытие virtual-page )
  • didShow ( открытие virtual-page )
  • didFreeze ( при заморозке странички - оптимизация )
• (ВОЗМОЖНО): Сделать swappable target, если человек нажимает на него только тогда срабатывают trigger на onPointerMove
• Refactor: Code split & fixing weak parts
• Xaf-utils