VX小程序三

小程序自定义组件使用

第一步：创建自定义组件

 创建compoents目录，在该目录下创建要复用的组件，例如：dialog组件

 其中dialo.js参数说明：

   properties：接收父级传递过来的值

     例如：
          properties: {
             title:{
               type:String,
               value:"标题"
             },
             content:{
               type:String,
               value:"内容"
             },
             cancelText:{
               type:String,
               value:"取消"
             },
             confirmText:{
               type:String,
               value:"确定"
             }

          }

第二步：如何引入组件

例如：在login页面中引入dialog组件

在dialog.json中引入

例如：

        {
            "usingComponents":{
                "dialog":"/components/dialog/dialog"
            }
        }

然后再dialog页面上使用dialog组件：

    例如：

        <dialog id="dialog"
                title="这是一个标题"
                bind:confirmEvent="_queding"
                bind:cancelEvent="_quxiao"
        ></dialog>

注意：
如何派发事件： this.triggerEvent('自定义事件名',要传递的数据);

     triggerEvent相当于vue的$emit

 例如： this.triggerEvent('confirmEvent',{name:"确定"});

如何监听事件：用bind监听派发过来的事件 相当于vue中的@

       例如：   bind:confirmEvent="_queding"

小程序支持单slot和多slot::与vue类似

参考：https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/wxml-wxss.html

数据持久化：

 cookie,H5本地存储(localstrorage,sessionStorage),webSql