小顺序实践小坑小结（一）

2023年2月19日 218次阅读 来源: sss55b

近来本身在做小顺序演习，分享一下我碰到的小坑

data数据更新

  • 直接对this.data举行赋值，是没法更新视图绑定的数据的，会形成数据不一致
  • 须要运用this.setData更新
this.data.key = value
this.setData({
  key: value
})

require

  • 临时不支持绝对路径
const util = require('../../utils/util.js')

background-image

  • 不能运用静态文件，只能运用base64和收集图片
  • 能够用<img>处理
background: #fff url(data:image/jpeg;base64,***)
<image class="logo" src="/images/logo.png" mode="cover"></image>

组件款式

  • app.wxss 的款式不能应用到组件内部
  • 能够按需援用 import: “”
@import "/app.wxss";

textarea

  • textarea默许款式有牢固宽度

事宜传参

  • 模板内里事宜不能传参
  • 运用event.currentTarget.dataset猎取
<view id="tapTest" data-hi="WeChat" bindtap="tapName"> Click me! </view>

Page({
  tapName(event) {
    console.log(event.currentTarget.dataset.hi)
  }
})

animation

  • animation不能直接绑定中组件上
  • 表面包裹一层<view>
<view animation={{animation}}>
  <my-component></my-component>
</view>

checkBox

  • checkbox-group绑定的bindChange事宜,我们中点击checkbox事宜会向上冒泡，致使外层也被点击
  • checkBox表面包一层view，给view增加一个catch事宜
<checkbox-group bindchange="checkboxChange">
  <view bindtap="bindTap">
    <view catchtap='catchTap'">
     <checkbox value="{{value}}" checked="{{checked}}"/>
    </view>
  </view>
</checkbox-group>
    原文作者：sss55b
    原文地址: https://segmentfault.com/a/1190000015853583
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞