wepy - 与原生有什么不同(事件更改)
事件 什么 不同 原生 更改
2023-09-11 14:14:36 时间
对于repeat,详情见官方文档
1 <style lang="less">
2 .userinfo {
3 display: flex;
4 flex-direction: column;
5 align-items: center;
6 }
7 .userinfo-avatar {
8 width: 80rpx;
9 height: 80rpx;
10 border-radius: 50%;
11 }
12 .userinfo-nickname {
13 color: #aaa;
14 }
15 .order {
16 color: #f00;
17 }
18 .btn {
19 width: 150px;
20 height: 30px;
21 color: #fff;
22 line-height: 30px;
23 text-align: center;
24 background-color: aquamarine;
25 border-radius: 10rpx;
26 margin: 5% 0;
27 }
28 .btn:active {
29 opacity: .7;
30 }
31 </style>
32
33
34 <template>
35 <view class="container">
36 <!-- 点击事件 -->
37 <view @tap="click" class='btn'>111{{num}}</view>
38 <!-- 点击传值事件 -->
39 <view @tap="clickValue({{num}})" class='btn'>666</view>
40
41
42 <!-- 循环组件:repeat -->
43 <repeat for="{{3}}" key="index" index="index" item="item">
44 <view>我要循环{{index}}次!!!</view>
45 {{index}}
46 {{item}}
47 </repeat>
48
49 </view>
50 </template>
51
52 <script>
53 /**
54 @tap="click" = bindtap
55 @tap.stop = catchtap
56 @tap.capture = capture-bind:tap
57 @tap.capture.stop = capture-catch:tap
58 @tap="click({{index}}) = bindtap="click" data-index={{index}}"
59 */
60 import wepy from 'wepy';
61 export default class Index extends wepy.page {
62
63 data = {
64 num: '我是数字'
65 };
66
67 methods = {
68 click() {
69 console.log('点击我了啊!');
70 },
71 clickValue(e) {
72 console.log('我拿data-到值了:', e);
73 }
74 };
75
76 onLoad() {
77 console.log('加载事件!');
78 }
79
80 }
81 </script>
相关文章
- 委托,事件,lambda,Linq 学习总结
- select下拉框选择触发事件
- mysql数据库binary log中的事件到底是什么?
- Windows窗体应用程序常用的几个类的属性、方法以及事件
- Flink-基于Table设置事件属性
- 猴子也能学会的jQuery第六期——jQuery事件(中)
- body中的onload事件和document.ready()有什么区别?
- 随机打印1-100,事件复杂度O(n)
- 如何让Form窗体接收KeyDown事件?
- 委托、Lambda表达式、事件系列02,什么时候该用委托
- PlayMaker的特殊事件FINISHED
- 由脱库攻击谈口令字段的加密策略——密码泄露事件杂谈之一
- 通俗解释什么是响应式编程?-响应式编程就是因为我们得“响应”这些事件而得以命名
- 什么是移动端的事件点透
- JavaScript是如何工作的:事件循环和异步编程的崛起 + 5种使用 async/await 更好地编码方式!
- 使用js实现可反馈执行成功状态的web ui自动化事件
- 在XcodeGhost事件之后,获取更纯净的Xcode的方法。
- jquery click()方法模拟点击事件对a标签不生效