【前端】Vue中子组件向父组件传值

谁践踏了优雅 2022-12-05 13:55 137阅读 0赞

子组件通过$emit方法（用来触发事件）传递参数。

*  子组件
    
        
        <template>
          <div class="children">
            <button @click="emitToParent>按钮点击传值给父组件</button>
          </div>
        </template>
        <script>
        export default {
               
            methods: {
               
                emitToParent(){
               
                    this.$emit('child-event', '我是子组件向父组件传递的内容')
                }
            }
        }
        </script>
 *  父组件
    
        
        <template>
          <div class="parent">
            <children @child-event='parentEvent'></children>
          </div>
        </template>
        import Children from 'components/children'
        export default {
            components:{
                Children
            },
            methods:{
                
                parentEvent(data) {
                    
                     console.log(data);
                }
            }
        }

发表评论取消回复

表情：

评论列表（有 0 条评论，137人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vue-父组件向子组件传值

[子组件向父组件传值，可点击查看][Link 1] 下面示例中是：父组件向子组件的单向数据流父级的更新会向下流动到子组件中，但是反过来则不行。每次父级组件发生更新时，子

太过爱你忘了你带给我的痛/ 2023年07月18日 12:50/ 0 赞/ 122 阅读

相关【前端】Vue中子组件向父组件传值

子组件通过$emit方法（用来触发事件）传递参数。子组件  <template>

谁践踏了优雅/ 2022年12月05日 13:55/ 0 赞/ 138 阅读

相关 Vue中子组件向父组件传递参数

> / > 父子组件传递数据 > 1）子组件向父组件传递数据：事件机制 > 子组件给父组件传递一个事件，并携带上数据 >

忘是亡心i/ 2022年11月10日 05:42/ 0 赞/ 176 阅读

相关 vue 父组件向子组件传值

先看代码： 1、父组件： <template> <div> <div v-if="!userShow"> 父组件内容区

￡神魔★判官ぃ/ 2022年04月17日 04:59/ 0 赞/ 339 阅读

相关 Vue.js 父组件向子组件传值和子组件向父组件传值

父组件向子组件传值 1. 组件实例定义方式，注意：一定要使用`props`属性来定义父组件传递过来的数据 <script> // 创建 Vue

た入场券/ 2022年03月16日 20:16/ 0 赞/ 331 阅读

相关 vue子组件向父组件传值

背景 vue实现数据交互之子组件向父组件传值，这里通过点击事件改变父组件的值方法子组件User.vue //点击hello users后改变父组件titl

傷城~/ 2021年12月12日 07:21/ 0 赞/ 401 阅读

相关 vue父组件向子组件传值

背景 vue要进行数据交互，若父组件要向子组件传值要怎么办那方法父组件的标签引用时，添加v-bind，子组件的props接收注册父组件App.vue

￡神魔★判官ぃ/ 2021年12月12日 06:51/ 0 赞/ 351 阅读

相关 React中子组件向父组件传值

举例父组件: var React = require('react'); import {render} from 'react-dom'; im

╰+攻爆jí腚メ/ 2021年09月29日 04:18/ 0 赞/ 289 阅读

相关 Vue子组件向父组件传值

子组件 props: { props:['childdata'], // 定义在父组件中的变量 }, me

太过爱你忘了你带给我的痛/ 2021年09月15日 12:18/ 0 赞/ 499 阅读

相关 vue父组件向子组件传值

子组件 -------------------- <template> <div class="timeline" > <div v-for=" data in c

以你之姓@/ 2021年09月15日 12:12/ 0 赞/ 529 阅读