VueJS 2.0 - 無法在道具上掛接組件更新

我需要強制更新時重新渲染組件，以便能夠呼叫FB.XFBML.parse()。但是，無論我做什麼，我都無法在更新屬性時調用任何生命週期掛鉤beforeUpdate/updated。（根據docs它只聽更新，其中props顯然不是）。VueJS 2.0 - 無法在道具上掛接組件更新

<template> 
    <div> 
    {{myProp}} 
    </div> 
</template> 

<script> 
    export default { 
    props: ['myProp'], 

    watch: { 
     myprop: function(newVal, oldVal) { // watch it 
      console.log('Prop changed: ', newVal, ' | was: ', oldVal) 
     }   
    }, 

    updated(){ // never invoked}, 

    beforeUpdate(){ // never invoked } 

    } 
</script>

我可以看到從一個父組件發送不同的值時，該屬性channel改變。

是否有掛鉤聽props更改？

更新

由於@克里斯的建議，我想我的watch財產，但什麼都沒有改變。然後我意識到，我有一種特殊情況：

<template> 
    <child :my-prop="myProp"></child> 
</template> 

<script> 
    export default { 
     props: ['myProp'] 
    } 
</script>

我傳遞myProp父組件接收到child組件。然後watch: {myProp: ...}不起作用。

來源

2017-06-16 zatziky

我相信在組件級道具的突變是不期望的行爲。道具意味着以一種方式流動 - 父母與孩子。另一種方法可能是創建一個基於道具的計算屬性並觀察那個？ https://vuejs.org/v2/guide/components.html#One-Way-Data-Flow – dispake

@dispake，我不需要改變'myProp'。我只需要知道它何時發生變化。當一個新的'myProp'從一個「更高」（不僅是父）組件發送時。 – zatziky

我希望道具能夠把所有的東西都流到孩子身上，並引發孩子的注意力。你能設置一個jsfiddle來展示你的用例嗎？ – Chris

什麼你要找的是watch：

<script> 
    export default { 
    props: ['channel'], 

    watch: { 
     channel(newValue) { 
     console.log(newValue) 
     } 
    } 
    } 
</script>

來源

2017-06-16 08:49:08 Chris

Chris，thx建議。我相應地更新了我的問題。 – zatziky

VueJS 2.0 - 無法在道具上掛接組件更新

回答

相關問題