91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

微信小程序父子組件傳值的方法是什么

小億
250
2023-11-04 12:49:37
欄目: 云計算

微信小程序父子組件之間傳值可以通過以下幾種方法實現:

  1. 屬性傳值:在父組件中通過屬性的方式將數據傳遞給子組件,在子組件的properties屬性中定義對應的屬性名,然后在子組件中通過this.properties獲取傳遞過來的值。

父組件中的wxml代碼:

<child-component value="{{value}}"></child-component>

父組件中的js代碼:

Page({
  data: {
    value: 'Hello World'
  }
})

子組件中的js代碼:

Component({
  properties: {
    value: {
      type: String,
      value: ''
    }
  },
  methods: {
    getValue() {
      console.log(this.properties.value); // 輸出:Hello World
    }
  }
})
  1. 事件傳值:子組件通過triggerEvent方法觸發一個自定義事件,并將需要傳遞的值作為參數傳遞給父組件,在父組件中監聽該事件,獲取傳遞過來的值。

父組件中的wxml代碼:

<child-component bind:myevent="handleEvent"></child-component>

父組件中的js代碼:

Page({
  handleEvent(event) {
    console.log(event.detail); // 輸出:Hello World
  }
})

子組件中的js代碼:

Component({
  methods: {
    sendValue() {
      this.triggerEvent('myevent', 'Hello World');
    }
  }
})
  1. 全局傳值:使用getApp方法獲取小程序實例,在實例中定義一個全局變量,通過該全局變量在父子組件之間進行數據傳遞。

父組件中的js代碼:

const app = getApp();

Page({
  data: {
    value: ''
  },
  onLoad(options) {
    app.globalData.value = 'Hello World';
  },
  getValue() {
    console.log(app.globalData.value); // 輸出:Hello World
  }
})

子組件中的js代碼:

const app = getApp();

Component({
  methods: {
    getValue() {
      console.log(app.globalData.value); // 輸出:Hello World
    }
  }
})

以上是三種常見的父子組件傳值的方法,根據具體需求選擇合適的方式進行數據傳遞。

0
萨嘎县| 耒阳市| 罗田县| 同心县| 呼和浩特市| 礼泉县| 滕州市| 浮山县| 桐梓县| 黄石市| 枞阳县| 彰化县| 界首市| 普定县| 扎兰屯市| 汕头市| 黄龙县| 平遥县| 邹城市| 肥乡县| 永泰县| 六安市| 福建省| 建始县| 当阳市| 曲阜市| 青田县| 浮山县| 称多县| 扎囊县| 麻城市| 濮阳市| 柳河县| 前郭尔| 海南省| 嵊州市| 错那县| 虹口区| 六枝特区| 平舆县| 吉隆县|