NativeScript-Vue 2.0: Back to the Vueture (Webinar) is now on YouTube
Директива v-view

Директива v-view используется для задания текущих элементов View в качестве родительского свойства.

Использование

<Child v-view:parentPropertyName />
<!-- равнозначно: -->
<Child ~parentPropertyName />
<Child v-view:parentArrayPropertyName.array />
<!-- равнозначно: -->
<Child ~parentArrayPropertyName.array />

Существует много компонентов NativeScript, которые требуют установки свойства в действительный экземпляр View, что невозможно с использованием шаблона. Использование этой директивы экономит время, не регистрируя новые директивы / ссылки на родительские элементы и не устанавливая родительские свойства вручную.

Чтобы лучше проиллюстрировать, что делает эта директива, давайте посмотрим на компонент RadSideDrawer из Progress NativeScript UI:

Компонент RadSideDrawer ожидает, что свойства drawerContent иmainContent будут установлены в экземпляры View, используя директиву v-view, и он будет выглядеть так:

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

Без этой директивы у вас бы было что-то вроде:

<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
  }
}

Что может стать утомительным и очень подвержено ошибкам.

Contributors