自定义组件的点击事件与传值 --（微信小程序）

一、自定义组件

官方文档（自定义组件）...

1、新建组件文件夹及组件文件

• 微信开发者工具—>新建文件右击‘新建component’

• json文件

  
  

2、wxml文件和js文件设置

3、相应的页面使用自定义组件

• json文件配置

• wxml文件（属性设置参数）

二、组件点击事件

官方文档（组件间通信与事件）...

自定义组件触发事件时，需要使用 triggerEvent 方法，指定事件名、detail对象和事件选项：

三、组件传值（点击事件传传参）

1、普通组件传参：

转换json格式查看：

{
    "type": "action",
    "timeStamp": 3226,
    "target": {
        "id": "",
        "dataset": {
            "item": {
                "id": 1,
                "shop": "张姐烤肉饭脆皮饭",
                "picture": "https://fuss10.elemecdn.com/0/85/8c35871b76aee22028071ab5f946ejpeg.jpeg?imageMogr/format/webp/thumbnail/!130x130r/gravity/Center/crop/130x130/",
                "product": "黑椒脆皮鸡+时蔬+米饭",
                "price": "18",
                "ifCommented": false
            }
        }
    },
    "currentTarget": {
        "id": "",
        "dataset": {
            "item": {
                "id": 1,
                "shop": "张姐烤肉饭脆皮饭",
                "picture": "https://fuss10.elemecdn.com/0/85/8c35871b76aee22028071ab5f946ejpeg.jpeg?imageMogr/format/webp/thumbnail/!130x130r/gravity/Center/crop/130x130/",
                "product": "黑椒脆皮鸡+时蔬+米饭",
                "price": "18",
                "ifCommented": false
            }
        }
    },
    "mark": {},
    "mut": false
}

其中：e.target.dataset.item为我们需要的参数信息 item为data-name中的name

2、路由传参

官方文档（路由导航）...