vue 子父组件之间的通信，及在调用组件的地方

本文主要是介绍vue 子父组件之间的通信，及在调用组件的地方，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

这里是用了 element ui 你们也可以看一下管方的文档 http://element.eleme.io/#/zh-CN/component/installation
组件html

<div class="Hander"><el-row :gutter="20"><el-col :span="4"><div class="back" @click="Back"><i class="el-icon-arrow-left"></i></div></el-col><el-col :span="16"><div class="bg-purple">{{HanderTitle}}</div></el-col><el-col :span="4"><div @click="PublicSave">{{saveTitle}}</div></el-col></el-row>
</div>

js

$emit 一是DOM绑定事件，二是自定义事件。可以传递参数我在这里用到就没有写

  methods: {PublicSave() {this.$emit("Public");},},

然后在引用组件的页面去调用emin定义的方法名也就是Public

html

  <hander @Public="PublicSave"></hander>    //Public是在组件emin自定义的方法

js

  import hander from "@/components/Hander";methods: {PublicSave() {      alert("1");}},

我实现的效果吧就是把app hander头部定义为组件，因为组件里面有自定义标题和右边有保存，跳转页面。每个页面的业务不一样，所以需要通信 emin 来实现 。

这篇关于vue 子父组件之间的通信，及在调用组件的地方的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---