小程序原生 自定义封装组件

懵懂的女人 提交于 2019-12-01 07:45:26

1.在components自定义文件夹,文件夹里分别包含wxml,wxss,js,json文件 (componetns文件是自己手写的)

2.wxml与wxss文件按照平常的来就好

3.js文件

Component({
  properties:{
         页面上需要动态传递的参数:数据类型
        例如:name:String,
             或者:sex:{
        type:Number
     }
      },
  methods:{
    //如果页面上有需要触发的事件
    confirm:function(){
      this.triggerEvent("confirmdata");//confirmdata这里填的什么,引用组件页面就写什么
    }
  }
})
 
4.json文件
{
  "component": true
}
到这里组件就封装完成了!下面就可以开始引用了!!
在需要引入的文件中
1.json文件 
{
   "usingComponents": {
    "dialog": "/pages/component/dialog/dialog"  // "名字随便定义":'组件页面的路径'
  }
}
2.wxml文件
<dialog  content="请重新登录" bind:confirmdata="handleConfirmDialog">
</dialog>
剩下的照常写就可以了!!!
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!