微信小程序-页面引用组件双向传参-请求设置

父子组件传参

再设置父子组件传参之前，我们得先知道如何创建一个组件和如何再想用的时候注册组件
首先创建组件
1.最简单的方式
是在你想创建的文件夹上右键会看到component点击即可创建
2.稍微麻烦点的
我们在用第一个创建完毕后，进行查看会发现组件和页面之间的不同只在js上也就是说，我们可以把任何一个页面变成组件进行引入
这是常规的组件js模板

// components/ont.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {

  },

  /**
   * 组件的初始数据
   */
  data: {

  },

  /**
   * 组件的方法列表
   */
  methods: {

  }
})

这是常规的页面的js

// pages/day4/day4.js
Page({

  /**
   * 页面的初始数据
   */
  data: {

  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})

对比两个js会发现他们的不同在最初的Page和Componet然后是组件为了接受参数而设置的properties和发参数的methods所以我们可以手动来更改。

页面引用组件双向传参

传值之前，我们得先使用组件，点开你想在哪里使用组件的页面会发现有一个xxx.json点开然后设置

{
  "usingComponents": {
    "你要使用该组件的名字":"地址",
  }
}

然后再你的xxx.wxml中写入

<你的名字 a="aaaa" bindevt = "receive" />

这里我的a是向组件传参 bindevt是一个方法接受组件传过来的参数,bindevt代码

receive(e){
console.log(e)
}

再组件的js中这样写

  properties: {
    a:String  //这里是根据你穿过来值的类型 我传的是字符串所以是string如果是数组则是Array可以在wxml中{{a}}这时候你会发现在你使用组件的页面中出现aaaa
  },

然后再组件中写一个button然后向所使用他的页面进行传参

  <button bindtap="send">send </button>

在组件的js中的methods中写入

 send(){
    this.triggerEvent("evt" ,{a:1} )
  }

然后再你所使用的页面里点击会发现打印出一下东西
这就是所传递的参数

请求设置

在微信小程序中没有跨域问题 但是却存在着对域名的校验，所以在开发中一般都会在左上角的详情–》本地设置–》不校验打上对勾

这样就可以发送请求了，在不打上对勾还想使用请求时则需要登录你注册的微信小程序页面
左侧找开发点击有一个开发设置向下滑动有个域名设置，来进行设置但是一个月只能设置5个，珍惜机会

这次就到这里，欢迎留言共讨