遇到的问题--微信小程序

Posted on 2020-03-18 17:00  打杂滴  阅读(167)  评论(0编辑  收藏  举报

事件对象可以携带额外信息,如 id, dataset, touches。

BaseEvent 基础事件对象属性列表:

 

 

 

dataset

在组件节点中可以附加一些自定义数据。这样,在事件中可以获取这些自定义的节点数据,用于事件的逻辑处理。

在 WXML 中,这些自定义数据以 data- 开头,多个单词由连字符 - 连接。

 

 

 

CustomEvent 自定义事件对象属性列表(继承 BaseEvent):

 

detail

自定义事件所携带的数据,如表单组件的提交事件会携带用户的输入,媒体的错误事件会携带错误信息,详见组件定义中各个事件的定义。

点击事件的detail 带有的 x, y 同 pageX, pageY 代表距离文档左上角的距离。


 

 

 

 

 

<switch checked="{{indicatorDots}}" bindchange="changeProperty" data-property-name="indicatorDots" />
 
changeProperty: function (event) {
var propertyName = event.currentTarget.dataset.propertyName
var newData = {}
newData[propertyName] = event.detail.value
this.setData(newData)
}
相当于
<switch checked="{{indicatorDots}}" bindchange="changeIndicatorDots" data-property-name="indicatorDots" />
 
changeIndicatorDots: function (e) {
this.setData({
indicatorDots: !this.data.indicatorDots
})
}
不过,前者更加通用
 

Page.prototype.setData(Object data, Function callback)

setData 函数用于将数据从逻辑层发送到视图层(异步),同时改变对应的 this.data 的值(同步)

 Object 以 key: value 的形式表示,将 this.data 中的 key 对应的值改变成 value

  1. 直接修改 this.data 而不调用 this.setData 是无法改变页面的状态的,还会造成数据不一致
  2. 仅支持设置可 JSON 化的数据。
  3. 单次设置的数据不能超过1024kB,请尽量避免一次设置过多的数据。
  4. 请不要把 data 中任何一项的 value 设为 undefined ,否则这一项将不被设置并可能遗留一些潜在问题。

 

wxss

rpx(responsive pixel): 可以根据屏幕宽度进行自适应。

使用@import语句可以导入外联样式表,@import后跟需要导入的外联样式表的相对路径,用;表示语句结束。

@import "./weui.wxss";
 

内联样式

框架组件上支持使用 style、class 属性来控制组件的样式。

  • style:静态的样式统一写到 class 中。style 接收动态的样式,在运行时会进行解析,请尽量避免将静态的样式写进 style 中,以免影响渲染速度。
<view style="color:{{color}};" />
  • class:用于指定样式规则,其属性值是样式规则中类选择器名(样式类名)的集合,样式类名不需要带上.,样式类名之间用空格分隔。
<view class="normal_view" />


 

 

Copyright © 2024 打杂滴
Powered by .NET 9.0 on Kubernetes