子组件调用父组件方法
<body> <div id="app"> <button>注册</button> <button>登录</button> <com @fun="funparent"></com> //1.自定义方法: fun(在子组件调用),调用父组件方法:funparent </div> <template id="tem"> <div> <button @click="e">注册页面{{ msgs }}</button> // 3.绑定事件触发子组件的e方法 <h1 >登录页面</h1> </div> </template> <script src="vue.js"></script> <script> var vm = new Vue({ el:'#app', methods:{ funparent(x){ console.log('这是一个父组件方法'+ x) } }, components:{ com:{ template:'#tem', methods:{ e(){ //2.在子组件中定义一个e方法,e方法中使用this.$emit('方法名',‘参数’)调用fun方法 this.$emit('fun','我在调用父组件方法'); } } } } }) </script> </body>
1.自定义方法: fun(在子组件调用),调用父组件方法:funparent
2.在子组件中定义一个e方法,e方法中使用this.$emit('方法名',‘参数’)调用fun方法
3.绑定事件触发子组件的e方法