微信小程式如何在事件中傳參

myskies發表於2023-04-22
微信小程式事件

在微信小程式中如果使用了wx:for進行渲染時，由於同時生成了很多一樣的dom。這時候如果想知道當前處理的是哪個物件，則需要在事件中進行傳參，方法如下：

<view data-xxx="{{xxx}}" bindonchange="bindOnChange">
</view>

此時，當觸發bindOnChange事件時，便可以在 C 中接收到使用data-xxx傳入的引數了.

bindOnChange(e) {
    console.log(e.currentTarget.dataset.xxx);
    console.log(e.target.dataset.xxx);
}

但是不知道微信出於什麼目的，當使用data-xxx來繫結資料時，竟然使用的不是地址傳遞，取而代之是進行值複製。比如：

  data: {
    xxx: {value: 123}
  },
  bindOnChange(e) {
    const xxx = e.currentTarget.dataset.xxx;
    xxx.value = 234;
    console.log(this.data.xxx.value);  // 結果仍然是123
  }

我想沒有使用簡單的地址傳遞而是取而代之了更復雜的值傳遞可能是為了照顧新手或是降低小程式框架的難度吧。

另外還有個小坑是，它的語法是：data-xxx="{{foo}}"，此時它會複製C層(實際上應該是 C 層中的資料複製（非值傳遞）到了 V 層)中的data.foo複製過去。如果語法不小心寫成data-xxx="foo", 那麼此時的foo將做為字串處理。

相關文章