华为快应用-父子组件的通信(父子组件传递信息)

父子组件传递信息有两种方法:
1.属性传值;
2.广播传值;

1)属性传值相对简单,即在子组件中用props声明属性,然后在父组件中使用时进行赋值,说起来简单,下面来说说具体怎么用:

//子组件 child.ux
props: [
      'name',
      'age'
       ]

//父组件内使用子组件
<child name="{{user_name}}" age="{{user_age}}"> </child>
然后可以对括号中的变量进行操作赋值,这样就完成了对子组件的传值操作。

2)广播传值
在父组件中:

//在你需要触发的地方写
 this.$broadcast("evtType1",{'infro': "华为快应用"});

在子组件中:

        onInit:function() {
            //注册通知
            this.$on('evtType1', this.evtTypeHandler)
        },
        data () {
            return {
                //这是变量名
                changeStr: '默认'
            }
        },
        evtTypeHandler(evt) {
            console.info('子组件:事件响应: ', evt.type, evt.detail)
            // 结束事件传递
            // evt.stop() 如果你希望只传递一次,就写上这句话,如果需要多次传递就千万不能写
            //给变量赋传递过来的值
            this.changeStr = evt.detail.changeStr;
        },

猜你喜欢

转载自blog.csdn.net/codingfire/article/details/81103859