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 - 无法在道具上挂接组件更新

回答

相关问题