A diretiva v-view
é usada para definir os elementos View
atuais com uma propriedade pai.
<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.