NativeScript-Vue 2.0: Back to the Vueture (Webinar) is now on YouTube
diretiva v-view

A diretiva v-view é usada para definir os elementos View atuais com uma propriedade pai.

Uso

<Child v-view:parentPropertyName />
<!-- same as: -->
<Child ~parentPropertyName />
<Child v-view:parentArrayPropertyName.array />
<!-- same as: -->
<Child ~parentArrayPropertyName.array />

Existem muitos componentes NativeScript que precisam de uma configuração de propriedade para uma instância válida de View, o que não é possível com um template. Usando essa diretiva, você ganha tempo por não ter que registrar uma nova diretiva / referência nos elementos pai, e configurar as propriedades do pai manualmente.

Para ilustrar melhor o que essa diretiva faz, vamos ver o componente RadSideDrawer do pacote Progress NativeScript UI:

O componente RadSideDrawer espera que as propriedades drawerContent e mainContent sejam definidas para as instâncias da View, usando a diretiva v-view ficaria assim:

<RadSideDrawer>
  <StackLayout ~drawerContent />
  <StackLayout ~mainContent />
</RadSideDrawer>

Sem essa diretiva você teria que fazer algo como:

<RadSideDrawer ref="drawer">
  <StackLayout ref="drawerContent" />
  <StackLayout ref="mainContent" />
</RadSideDrawer>
{
  mounted() {
    this.$refs.drawer.nativeView.drawerContent = this.$refs.drawerContent.nativeView
    this.$refs.drawer.nativeView.mainContent = this.$refs.mainContent.nativeView
  }
}

Que pode ser tedioso e muito propenso a erros.

Contributors