欧美三级国产三级日韩三级_亚洲熟妇丰满大屁股熟妇_欧美亚洲成人一区二区三区_国产精品久久久久久模特

微信小程序中的組件傳值 - 新聞資訊 - 云南小程序開發(fā)|云南軟件開發(fā)|云南網(wǎng)站建設(shè)-昆明葵宇信息科技有限公司

159-8711-8523

云南網(wǎng)建設(shè)/小程序開發(fā)/軟件開發(fā)

知識

不管是網(wǎng)站,軟件還是小程序,都要直接或間接能為您產(chǎn)生價值,我們在追求其視覺表現(xiàn)的同時,更側(cè)重于功能的便捷,營銷的便利,運營的高效,讓網(wǎng)站成為營銷工具,讓軟件能切實提升企業(yè)內(nèi)部管理水平和效率。優(yōu)秀的程序為后期升級提供便捷的支持!

您當(dāng)前位置>首頁 » 新聞資訊 » 小程序相關(guān) >

微信小程序中的組件傳值

發(fā)表時間:2020-10-5

發(fā)布人:葵宇科技

瀏覽次數(shù):73

父傳子

父組件中的json文件

{
  "component": true,                              //設(shè)置component為true
  "usingComponents": {
    "componentB": "../child2/child2"         //這個是引入子組件
  }
}

第二步是在父組件中的wxml中使用子組件中模塊

<view>                                                 //這個是父組件的內(nèi)容
   <view>子組件內(nèi)容:</view>
   <componentB customAttribute='我是A向B中傳入的參數(shù)'/>   
 //這里customAttribute是自定義屬性
</view>

在子組件中:

Component({

  behaviors: [],

  properties: {
    paramAtoB:String    //聲明父組件傳過來的類型為string類型
  },
  data: {

  }, // 這里放的是子組件的私有數(shù)據(jù),可用于模版渲染

      // 生命周期函數(shù),可以為函數(shù),或一個在methods段中定義的方法名
  attached: function () { },
  moved: function () { },
  detached: function () { },

  methods: {

  }

})

在父組件中使用:

<view>父組件中傳來的參數(shù):{{customAttribute}}</view>

子傳父

子組件中的wxml:

<view>
  <button bindtap='customEvent'>A中傳入?yún)?shù)</button>     
//customEvent事件名--點擊觸發(fā)
</view>
12345

子組件中的js

Component({

  behaviors: [],

  properties: {

  },
  data: {

  },
  attached: function () { },
  moved: function () { },
  detached: function () { },

  methods: {
    change:function(){
      this.triggerEvent('myevent', { msg:123});   
//這里的this.triggerEvent相當(dāng)于一個發(fā)射器 發(fā)射一個事件給父組件                                                             
 //(myevent)第一個參數(shù)是自定義事件,{msg:123}第二個參數(shù)是要傳遞的數(shù)據(jù)
    }
  }

})


父組件中接受參數(shù):

 <componentB paramAtoB='我是A向B中傳入的參數(shù)' bind:myevent="onMyEvent"/>   
//在父組件的子模板上綁上子模板傳過來的事件   (myevent)   
//子組件點擊事件后傳到父組件,父組件所處理數(shù)據(jù)的事件onMyEvent
123

事件執(zhí)行,通過e.detail.msg獲取到子傳遞過來的數(shù)據(jù)

Component({

  behaviors: [],

  properties: {

  },
  data: {

  }, // 私有數(shù)據(jù),可用于模版渲染

  // 生命周期函數(shù),可以為函數(shù),或一個在methods段中定義的方法名
  attached: function () { },
  moved: function () { },
  detached: function () { },

  methods: {
   >:function(e){
     
      console.log(e.detail.msg)    \\e.detail.paramBtoA這就是子傳父傳遞過來的數(shù)據(jù)
    
    }
  }

})

相關(guān)案例查看更多