小程序传值

A页面向B页面传递值

onLoad方法将字符串'aaa'赋值给wx.aaa变量。而 jump 方法用来响应按钮的点击事件，当点击按钮时会跳转至 /pages/b/b 页面

<button bindtap="jump">跳转</button>

// 在页面的 js 文件中
onLoad(options) {
    wx.aaa='aaa';// 将 'aaa' 赋值给 wx.aaa
}

//执行jump函数
jump(){
    wx.navigateTo({
        url: '/pages/b/b',// 跳转到 /pages/b/b 页面
    })
},

 在 /pages/b/b 页面中，可以通过 wx.aaa 获取到传递的值 'aaa'。在正确的时机使用该值，例如在页面的 onLoad 方法中：

// 在 /pages/b/b 页面的 js 文件中
onLoad() {
  let value = wx.aaa;
  console.log(value); // 输出 'aaa'
}

这种方式是通过在全局对象 wx 上定义变量来实现数值的传递。

注意：这种传值方式有一些限制，例如需要在源页面的生命周期中赋值，目标页面的生命周期中才能获取到正确的值。同时，需要注意全局变量的使用场景，确保不会造成不必要的混淆或冲突。

父传子：

如果我们想在父组件中使用子组件，并传递 listData 数组作为属性值。子组件接收父组件传递的属性值，并在子组件内部使用 wx:for 循环渲染。

首先，确保父组件的 JSON 配置中已经引入了子组件：

// 在父组件的 JSON 配置文件中
"usingComponents": {
  "lists": "../../component/list/lists"
}

data:{
    listData:[{id:1,name:'男装'}]
}

然后，在父组件的 WXML 文件中使用子组件： 

<!-- 在父组件的 WXML 文件中 -->
<lists lists="{{listData}}"></lists>

上述代码将 listData 数组作为 lists 属性的值传递给子组件。在子组件中，需在 properties 中声明 lists 属性，并指定类型为 Array，如下：

// 在子组件的 JS 文件中

//第一种
properties: {
  // 接收父组件传递过来的值
  lists: {
    type: Array,
    value: [
      {
        id: 2,
        name: "默认值"
      }
    ]
  }
}


//第二种
properties: {
  // 接收父组件传递过来的值
  lists:Array
}

这样，子组件就能够接收父组件传递过来的 listData 数组，并在子组件的 WXML 文件中使用 wx:for 循环渲染，如下：

<!-- 在子组件的 WXML 文件中 -->
<view wx:for="{{lists}}" wx:key="id">{{item.name}}</view>

以上代码会将 lists 数组中的每个对象渲染为一个 <view> 元素，并展示其 name 属性的值。

<lists lists="{{listData}}"></lists>----第一种
<lists></lists>                     ----第二种

第一种方式是传递具体的数组 listData 给子组件。

第二种方式是在子组件的属性声明中设置一个默认值，供父组件未传递属性时使用。

子传父：

如果想在子组件中触发一个自定义事件，将数据传递给父组件，并在父组件中监听该自定义事件并获取传递的数据。在子组件中，可以使用 bindtap 绑定一个点击事件，并在事件处理函数中使用 this.triggerEvent 来触发一个自定义事件，并传递数据。

子组件的代码如下：

<!-- 在子组件的 WXML 文件中 -->
<view bindtap="givefather">子传父</view>

// 在子组件的 JS 文件中
Component({
  methods: {
    givefather() {
      let msg = '这是子组件传给父组件的数据';
      this.triggerEvent('zidingyishijianming', msg);
    }
  }
})

在父组件中，可以使用 bind:自定义事件名 来监听子组件触发的自定义事件，并在事件回调函数中获取传递的数据。

父组件的代码如下：

<!-- 在父组件的 WXML 文件中 -->
<lists bind:zidingyishijianming="fatherhuode"></lists>

// 在父组件的 JS 文件中
Page({
  fatherhuode(e) {
    console.log('e', e.detail); // 输出从子组件传递的数据
  }
})

当在子组件中触发 givefather 事件后，父组件的 fatherhuode 方法会被调用，并且可以通过 e.detail 获取到子组件传递的数据。在这个示例中，输出的结果将是 '这是子组件传给父组件的数据'。

注意：在父组件中使用自定义事件时，需要绑定在子组件标签上，使用 bind:自定义事件名，并在事件回调函数中使用 e.detail 来获取子组件传递的数据。