Блог

Я создаю один многоразовый компонент. Существует два дочерних компонента. Этот поток выглядит так, как показано ниже

 Child component 1 -> Parent Component -> Super Parent main Component
 

В дочернем компоненте я создаю URL-адрес prop, затем передаю его в родительский компонент, а затем передаю в Суперпродительский компонент, где я передаю значение, подобное приведенному ниже.

Дочерний компонент

 prop: {
    urls: {
            type: Object,
            required: true,
            default: () => ({
               saveProduct: '/entity/save',
               updateProduct: '/entity/update
            })
        }
}
 

Родительский компонент

     <ChildComponent :urls = "uris" />

    props: {
      uris: {
          type:Object,
          required:true,
          default: () => ({})
      }
   }
 

Супер Родительский компонент

 <ParentComponent :uris="urls" />

 data() {
  return {
    urls: {
          saveUri: `/products/${this.$route.params.id}/categories`,
          updateUri: `/products/${this.$route.params.id}/categories/${this.productId}`
      }
  }
 }
 

Здесь я даю фрагменты для потока не полного кода. Я хочу знать общий способ получения значения ProductID в Super parent.

Здесь я могу получить это (это.$route.params.id) значение, но как я могу получить значение productid, доступное в super parent из дочернего компонента.

Любой общий пример будет полезен для меня… Как отправить данные от одного компонента следующему из следующих компонентов?

Реквизиты предназначены для передачи данных вниз от родителя к ребенку. Для передачи данных вверх от ребенка к родителю, emit а также события от ребенка и прослушивания его в родителе.

 this.$emit('clicked', 'someValue')
 

Другим вариантом было бы использование глобального хранилища состояний, такого как Vuex.