Onsen + VueJS: обратный вызов из дочернего компонента (с использованием onsNavigatorProps) - PullRequest
Новая
       26

Onsen + VueJS: обратный вызов из дочернего компонента (с использованием onsNavigatorProps)

0 голосов
/ 18 мая 2018

По документации здесь

Если страница A нажимает на страницу B, она может отправлять функцию в качестве реквизита или данные, которые изменяют контекст страницы A.Таким образом, всякий раз, когда мы хотим отправить что-либо на страницу A со страницы B, последней нужно просто вызвать функцию и передать несколько аргументов: 

// Page A
this.$emit('push-page', {
  extends: pageB,
  onsNavigatorProps: {
    passDataBack(data) {
      this.dataFromPageB = data;
    }
  }
});

Я следую этой идее.Делая что-то подобное с this.$store.commit

Я хочу нажать AddItemPage и получить возвращаемое значение, скопированное в this.items

//Parent.vue

pushAddItemPage() {
this.$store.commit('navigator/push', {
  extends: AddItemPage,
  data() {
    return {
      toolbarInfo: {
        backLabel: this.$t('Page'),
        title: this.$t('Add Item')
      }
    }
  },
  onsNavigatorProps: {
    passDataBack(data) {
      this.items = data.splice()   //***this*** is undefined here             
    }
  }
})
},

//AddItemPage.vue   
...    
submitChanges()
{
   this.$attrs.passDataBack(this, ['abc', 'xyz']) // passDataBack() is called, no issues.
},    
...

Единственная проблема - , это недоступен внутри функции обратного вызова.

Так что я не могу сделать this.items = data.splice()

1 Ответ

0 голосов
/ 21 мая 2018

текущий контекст доступен с помощью оператора со стрелкой.

Правильная версия: 

onsNavigatorProps: {
    passDataBack: (data) => {
      this.items = data.splice()                
    }
}
...