訪問父變量VueJS 2

Question

我有一個.Vue一些孩子的模板：

<template> 
    <test></test> 
</template> 
... 
export default { 
    data() { 
    hello: ''; 
    } 
} 

在test.vue我試圖訪問「你好」，但我不能。我試過使用'道具'，但沒有運氣。我如何實現這個簡單的任務？

Answer 1

這實際上是直接與道具。也許它不起作用，因爲你的data函數中的語法錯誤？

parent.vue：

<template> 
    <test :my-prop="hello"></test> 
</template> 

<script> 
    export default { 
     data:() => ({ 
      hello: 'foobar' 
     }), 
     // ... 
    }; 
</script> 

test.vue：

<template>...</template> 

<script> 
    export default { 
     props: ['myProp'], 
     mounted() { 
      console.log(this.myProp); // foobar 
     } 
    }; 
</script>