我不能vue.js

Question

我在vue.js是新的數據傳遞.. 我用的WebPack + VUE-CLI。

但我不能從父數據傳遞到孩子

這樣的代碼..

<template lang="html"> 
 
    <div> 
 
    <input v-model="parentMsg"></input> 
 
    <br> 
 
    <child v-bind:msg="parentMsg"></child> 
 
    </div> 
 
</template> 
 

 
<script> 
 
import child from './components/lists' 
 
export default { 
 
    data: function() { 
 
    return { 
 
     parentMsg: '' 
 
    } 
 
    }, 
 
    computed: {}, 
 
    ready: function() {}, 
 
    attached: function() {}, 
 
    methods: {}, 
 
    components: { 
 
    child 
 
    } 
 
} 
 
</script>

<template> 
 
    <div> 
 
    {{msg}} 
 
    </div> 
 
</template> 
 

 
<script> 
 
export default { 
 
    data: function() { 
 
    return { 
 
     msg: '' 
 
    } 
 
    } 
 
} 
 
</script>

由WA Y ... 如何子組件綁定到父陣列..

parent: data: array[...], 
I want to bind the first of children's data to arr[0] 
second to array[1].. 

這可能嗎？或使用v-for？

Answer 1

在你的子組件使用props財產接收像父數據：

<script> 
export default { 
    props: ['msg'], 
    data: function() { 
    return { 

    } 
    } 
} 
</script> 

瞭解更多關於這個here