子组件是不能直接使用父组件中的方法的,需要进行事件绑定(v-on:自定义方法名="父组件方法名"),然后在子组件中再定义一个方法,使用this.$emit(‘自定义方法名‘)语句完成父组件中方法到子组件中的调用,最后直接调用子组件中定义的方法即可。
<div class="app"> <mycom v-on:func="parentshow"></mycom> <!-- 通过v-on:绑定方法将父组件中的方法绑定到func, 然后在子组件中定义一个方法(this.$emit(‘func‘))将func传递给子组件, 这样子组件就可以通过自己的方法来调用父组件的方法 --> </div> <template id="cmp"> <div> <a href="#" @click.prevent="show">快点我</a> </div> </template> <script> var vm = new Vue({ el:‘.app‘, data:{ msg:‘我是父组件的方法‘ }, methods:{ parentshow(){ alert(this.msg) } }, components:{ mycom:{ template:‘#cmp‘, methods:{ show(){ this.$emit(‘func‘)//通过此方法在子组件建立方法来调用父组件中的方法 } } } } }) </script>
原文地址:https://www.cnblogs.com/qiqisusu/p/11372950.html
时间: 2024-10-30 22:18:12