vue—子调父 $emit (把子组件的数据传给父组件)
注意: Hello.vue 子组件 App.vue 父组件
<!--Hello.vue :-->
<template>
<div class="hello">
<input type="button" name="" id="" @click="chilCall()" value="子调父" />
</div>
</template>
<script>
export default {
name: 'hello',
'methods': {
chilCall(pars) {
this.$emit('newNodeEvent', '我是子元素传过来的') // 1、
}
}
}
<!--App.vue :--> <template> <div id="app"> <hello @newNodeEvent="parentLisen" /> // 4、 </div> </template> <script> import hello from './components/Hello' // 2、 export default { name: 'app', 'components': { hello }, methods: {
// 3、子组件传的值 parentLisen(evtValue) { //evtValue 是子组件传过来的值 alert(evtValue) } } } </script>