• 小程序组件--> 组件传参


    小程序组件,在components文件夹右击-->创建文件夹-->右击-->新建component即可 创建一个组件

    如果多个地方需要使用到,可以在app.json中加入一下代码,相当于vue的全局组件。

    "usingComponents": {
        "btn": "/components/文件夹名/js文件名"
      }

    如果单独引用,直接在引用的json文件中

    "usingComponents": {
        "btn": "/components/文件夹名/js文件名",
      }

    如果是想用page里面的一个页面作为组件 只需要将他改为和component 格式一样即可  (在page里面写了,又突然觉得需要作为组件,可以用这个方法直接将整个文件丢进components) 一定要注意改造一下

    需要注意的是小程序组件有自己的生命周期,文档

    参考大佬链接  https://www.jianshu.com/p/7f366aba54c3

    组件之间传参数  感觉和vue有一丢丢相似

    父传子

    父组件中写 传过去的值。传过去了之后呢,就直接他娘的 this.data.name 就拿到父组件传过去的值了  例如    

    父组件     当然这个name 是需要在父组件中的data里面定义的

    <view> <btn name='{{name}}'></btn> </view>

    子组件
    Component({
      //vue里面是props(缩写),这里是全称。用来接收父组件传过来的东西
      properties: {
        name: {
          type: String,//类型
          value: 'xxx'//默认值
        }
      },
      data: {
        
      }
    })

    子传父     咱先在子组件中 搞点事儿

    子组件中搞de事儿
    Component({
    //vue里面是props(缩写),这里是全称。用来接收父组件传过来的东西 properties: { name: { type: String,//类型 value: 'xxx'//默认值 } }, data: { }, methods:{ giveFarther(){ this.triggerEvent('giveFarther', { xixi: "666传值成功" }); //这里giveFarther就是事件名,后面带着的就是传过去值 } } })
    <view>
      <btn name='{{name}}' bind:giveFarther="getSonName"></btn> //这里 就是在组件中绑定了一个子组件的事件名 giveFarther 随后在js中写
    </view>

    想象下面是JS文件哈

    giveFarther(ev){
      console.log(ev) //打印看看
    }

    随附大佬链接 :https://www.jianshu.com/p/ea830fe470fa

  • 相关阅读:
    WPF Image控件的Source属性是一个ImageSource对象
    wx:if 与hidden
    切换远程分支
    异步请求(简单一说)
    多维数组降维方法,简单一提
    3.25发版之最后的搜索框
    wepy-城市按字母排序
    new一个新对象。。。对象???
    参数函数是对象的理解
    群辉 MariaDB 10 远程连接
  • 原文地址:https://www.cnblogs.com/TreeCTJ/p/11613624.html
Copyright © 2020-2023  润新知