小程序详解子传父

子组件

这是这个组件组件的xml;
bindblur是失焦事件；
动态绑定属性值，不需要冒号：
myplaceholder是绑定的提示语

<view class="flex-cont">
    <text class="text-head">{{haeder}}</text>
    <input type="number" placeholder="{{myplaceholder}}" 
    class="inp-tel" maxlength="11" bindblur="lossof" />
</view>

============
Component({
    /**
     * 组件的属性列表  它负责这个组件所接受的参数；
     * 有父组件进行赋值
     */
    properties: {
        myplaceholder:{
            type:String, //类型字符串
            value:"请输入手机号码" //默认值
        },
        haeder:{
            type:String,
            value:"手机号码"
        }
    },

    /**
     * 组件的初始数据  data中的变量不要和properties中重复；
     */
    data: {

    },

    /**
     * 组件的方法列表
     * 参数参数e,去拿到input框中的值；
     */
    methods: {
        lossof(e){
            let cont=e.detail.value; //拿到input框中用户输入的值；
            //第一参数是： itemclick是父组件中的事件，(你自己定义)；
            //第二个参数：是一个对象，负责传递值，多个值使用逗号，key值不需要引号
            this.triggerEvent("itemclick",{
                input:cont,
                title:'内容是'
            });
        }
    }
})
==================
/* components/login-input/login-input.wxss */
.flex-cont{
    display: flex;
    align-items: center;
    
}
.inp-tel{
    width: 600rpx;
    height: 80rpx;
    border: 1px solid #ccc;
    margin: auto;
    background: #ccc;
    border-radius: 10rpx;
    padding-left: 10rpx;
    box-sizing: border-box;
}
=====================

使用页面
注册一下，这样就可以使用这个组件了；

{
  "usingComponents": {
    "myinput":"/components/logininput/logininput"
  }
}

================================================

<myinput myplaceholder="请输入手机号码1"
bind:itemclick='sonHander'
haeder="手机号"></myinput>

ps:与注册中的key值相同

================================================
 //obj返回的是一个对象
 //obj里还有其他数据
 sonHander(obj){
    console.log("父组件收到的值是",obj.detail)
  },