Skip to content

Experimente com StackBlitz ​

Abrir o playground do router no StackBlitz

Edite um app NativeScript-Vue no navegador e execute sua interface nativa em um celular ou tablet pelo NativeScript Preview. O navegador hospeda o editor e a compilação; ele não emula views do UIKit ou Android.

Iniciando uma sessão ​

  1. Instale o NativeScript Preview no aparelho pelos links do site.
  2. Abra o playground acima. O StackBlitz instala as dependências e inicia ns preview pela integração oficial do NativeScript.
  3. Espere o QR code do Preview e escaneie com o aparelho. Mantenha a sessão aberta enquanto edita.
  4. Abra src/router.ts para mudar rotas, ou uma página em src/pages/ para mudar a interface.

O código do exemplo é independente e fixa vue-router-ns@0.1.0-beta.6. Não exige compilar este repositório nem resolver um alias para ../dist.

O que experimentar ​

ExercícioOnde
Empurrar vários itens e voltar por elessrc/pages/Home.vue, src/pages/Item.vue
Abrir um modal e devolver uma respostasrc/pages/Item.vue, src/pages/Compose.vue
Cancelar um rascunho preenchido para executar o leave guardsrc/pages/Compose.vue
Manter lista e detalhe visíveis em uma janela largasrc/App.vue (RouterSplitView)
Inspecionar a rota de cada página e o histórico combinadosrc/pages/Item.vue

Veja navegação, guards, resultados de modais e split view para as APIs correspondentes.

Recursos nativos ​

O Preview fornece um app nativo pré-compilado. O runtime, as bibliotecas e o manifesto instalados nele determinam quais APIs estão disponíveis; adicionar uma dependência npm não adiciona uma biblioteca nativa ausente nesse app. Mudanças no seu App_Resources exigem um build nativo completo.

Em particular, o progresso do predictive back no Android 14/15 exige ativação no manifesto, e o zoom do iOS exige iOS 18+ e runtime compatível. Uma sessão Preview não confirma o funcionamento dessas funções no manifesto do seu app de produção. Use o demo local para testar configuração nativa, restauração após morte do processo e builds de release.

O exemplo segue o template oficial Vue 3 para StackBlitz. Checar TypeScript e bundles por plataforma é diferente de testar uma sessão Preview completa em um aparelho conectado; este exemplo não afirma que essa última etapa foi verificada.

Se a sessão não iniciar ​

Confira erros de instalação/build no terminal do StackBlitz e o suporte de navegadores. Confirme que o Preview está atualizado e consegue conectar à sessão. Para testar o mesmo código localmente, instale o NativeScript CLI, rode npm install em examples/playground e então ns preview.

O demo local completo continua disponível se o runtime do Preview não oferecer algum recurso. Mais detalhes: integração e limitações do NativeScript Preview.

Publicado sob a licença MIT.