從擴展了另一個組件的VueJS組件中更新一個數據屬性

我正在構建一個VueJS組件，當一個prop更新時需要更新一個數據屬性。從擴展了另一個組件的VueJS組件中更新一個數據屬性

該組件擴展了需要query數據屬性的自動完成組件。但是，它並不像我期待的那樣工作。

values prop更新時，如何更新query數據屬性？

<template> 
    <div> 
     <input :name="fieldName" type="hidden" v-bind:value="values.id"> 

     <input :name="'search[' + fieldName + ']'" 
       type="text" 
       v-model="query" 
       @keydown.down="down" 
       @keydown.up="up" 
       @keydown.enter.prevent 
       @keydown.enter="hit" 
       @keydown.esc="reset"/> 
    </div> 
</template> 

<script> 
    import VueTypeahead from 'vue-typeahead' 

    export default { 
     extends: VueTypeahead, 

     props: ['endpoint', 'fieldName', 'values', 'format'], 

     data() { 
      return { 
       query: '', 
       src: this.endpoint, 
       limit: 5, 
       minChars: 3, 
       queryParamName: 'q' 
      } 
     } 
    } 
</script>

來源

2017-06-15 bencarter78

這不是基本相同的問題今天早些時候問？ https://stackoverflow.com/q/44570949/38065 – Bert

@BertEvans ha！好吧，我後來意識到你回答了我的問題，但問題不是我所需要的。這是關於看道具（我不知道/想想）。也許如果我知道更多關於Vue的話，我可以/應該這樣做了！ – bencarter78

這很好，我只是好奇他們爲什麼如此相似。 – Bert

坐落在values一位守望更新的query：

watch: { 
    values() { // called anytime this.values changes 
    this.query = this.values; 
    } 
}

來源

2017-06-15 16:01:01 thanksd

夥計，你已經保存了一天！謝謝。我一直試圖在整個下午解決這個問題，並且達到了我無法看到樹木的地步！ – bencarter78

從擴展了另一個組件的VueJS組件中更新一個數據屬性

回答

相關問題