前沿

---

小程序是之前开发的了，之前一直忙，现在有点小空总结一下，方便以后，忘记了还可以翻翻笔记。看完自几在写几遍你就会发现跟vue的大同小异。

一，父组件传给子组件

父组件写法：

这是通过viewText="{{viewText}}"传向子组件。

<MyToast viewText="{{viewText}}" bind:myEvent="OnViewText"></MyToast>

子组件写法

子组件是通过properties来获取：

  properties:{
            viewText:{    //属性名
              type:Number,    //类型，必填项  目前接受的类型有：String,Number,Boolean,Object,Arrray,null(表示任意类型)
              value:''     //属性初始值(可选)如果未制定，会根据类型选择一个。
                
            }
          }

接下来就是在methods:方法里边的自定义函数中来取值就好了

methods:{
    //这里是随便一个方法名字
   getnumber:function(){
     console.log(this.data.viewText);    //这样就可以取道父组件传过来的值了
     }
}

二，子组件传给父组件

子组件写法

//这里的input是子组件中的某个输入框
<input type="number" bindinput="getInputnumber" value="{{codes}}"></input>
methods:{
    //这里是bindinput的方法名
     getInputnumber:function(e){
       this.triggerEvent('myEvent',e.detail.value)   //这里的myEvent是自己自定义的事件名字，需要父组件中通过他来接受，
     }
}

父组件写法

这里我还引用上边父组件的名字，也就是说子组件在触发这个方法后需要在父组件中手动获取就好了。

<MyToast viewText="{{viewText}}" bind:myEvent="OnViewText"></MyToast>
//这里的myEvent是子组件传递过来的自定义事件名称，OnViewText这个是父组件中自定义的事件名称
methods:{
   OnViewText:function(e){
    //这立的这个e就是子组件传过来的值
    this.setData({
         code:e
   })
}
}

到此就结束了，希望看到的小伙伴觉得还有不足的地方，多多发言！共同进步！