zoukankan      html  css  js  c++  java
  • 【VUE3.0体验】props和emit在setup中的用法

    1、props是指父组件通过属性的形式将值传给子组件

    <user-save
            :userid="data.ActiveUserId"
            v-if="data.dialogVisible"
            @closeDialog="closeDialog"
        />
    

     比如这个,他的userid就是一个父组件与子组件相通的接口,在子组件中,使用这种方法取值

    props: ["userid"],
       setup(props, context) {
            console.log(props.userid);....
    

    2、emit是子组件方法调用父组件方法,先上父组件代码

    <user-save
            :userid="data.ActiveUserId"
            v-if="data.dialogVisible"
            @closeDialog="closeDialog"  //closeDialog在父组件中有一个方法
        />
    

      

    子组件代码

     setup(props, context) {
    const closeDialog = () => {
          context.emit("closeDialog");
    };
    

     子组件中也有一个叫closeDialog的方法,这个名字可以随便改,但是里面的context.emit后面的方法名必须和父组件中的一致。

    context 是在setup的第二个参数。

    调用方法是选执行子组件里的,然后到了emit后调用父组件的。

  • 相关阅读:
    Docker
    Docker
    Docker
    Docker
    Docker
    Docker
    pandas——向已经存在的excel数据写入data
    python——利用UI选择路径
    python——装饰器的使用
    python——生成器(协程)gevent多任务
  • 原文地址:https://www.cnblogs.com/youyuan1980/p/15484212.html
Copyright © 2011-2022 走看看