vue组件传值调方法

父子组件值传递

传递dictId  <child v-bind:dictId="dictId"></child>

        <template>
            <Modal
                    v-model="modal1"
                    :title="modelTitle"
                    @on-ok="ok"
                    ok-text="提交"
                    @on-cancel="cancel">
                <DictTypeForm @refreshDict="refreshDict" ref="dictTypeForm" v-bind:dictId="(curDict!=null&&curDict!='')?curDict.id:null"></DictTypeForm>
            </Modal>
        </template>

注册组件

<script>
    import DictTypeForm from "./dictTypeForm";
    export default {
        components: {DictTypeForm},
        data() {}
    }
</script>

子组件获取

<script>
    export default {
        props: ['dictId'],
        data() {}
    }
</script>

父组件调用子组件的方法

前提条件：【1】子组件有方法handleSubmit【2】父组件调用的子组件有属性<child ref="dictTypeForm"></child>

this.$refs.dictTypeForm.handleSubmit() // 父组件调用子组件的方法

子组件调用父组件的方法

前提条件：【1】父组件有refreshDict方法【1】父组件调用的子组件的写法<child @refreshDict="refreshDict"></child>

 

this.$emit('refreshDict');//提交完之后刷新父组件的数据