一. 父传子

本文以input双向数据绑定为例

首先在components中创建一个MyInput组件,组件中放一个input输入框

父组件在页面引入注册后,以标签的形式在页面中使用

父组件在标签上定义自定义属性,用于给子组件传递数据
:自定义属性名="变量名"
子组件可传递变量与固定值,固定值不带引号即可,此处不做演示

<MyInput :msg="9" :data="str"></MyInput>

父组件通过props进行接收 ( 数组版与对象版 )

export default {
    name: 'MyInput',
    //数组接收 通过this.msg || this.data接收传递的值
    // props:['msg','data'],
    //对象接收  type为数据类型,defaulf为默认值,通过this.msg || this.data接收传递的值
    props: {
        msg: {
            type: Number,
            default: 0
        },
        data: {
            type: String,
            default: ''
        }
    },
    data() {
        return {
            value: ''
        };
    },
    methods: {},
    created() {
        console.log(this.msg);
        console.log(this.data)
    },
    computed: {},
    components: {},
};
</script>