父传子

父组件将参数传递给子组件

父组件

// 父组件
<templete>
    <div>
        <input v-model="text"/>
        <child :text="text"></child>
    </div>
</templete>
<script>
    import child from './child'
    export default {
        components: {
            child
        },
        data() {
            return {
                text: ''
            }
        }
    }
</script>

子组件

// 子组件
<templete>
    <div>
        我是父组件传来的值 {{text}}
    </div>
</templete>
<script>
    export default {
        props: {
            text: {
                type: String,
                default: ''
            }
        }
    }
</script>

Last updated