1 <template>
2 <view>
3 <view style="width: 100%; height: 150upx;"></view>
4
5 <input type="text" :value="title"
6 style="background-color: #007AFF;height: 100upx"
7 @input="change"
8
9 @focus="focus"
10
11 @blur="blur"
12
13 @confirm="confirm"
14
15 @click="click"
16
17 @tap="tap"
18
19 @longpress="longpress"
20
21 @touchstart="touchstart"
22
23 @touchend="touchend"
24
25 @touchmove="touchmove"
26
27 @touchcancel="touchcancel"
28 />
29 <!-- 不推荐使用了, 请使用 longpress @longtap="longtap" -->
30 </view>
31 </template>
32
33 <script>
34 export default {
35 data() {
36 return {
37
38 }
39 },
40 methods: {
41 change(){
42 console.log("输入框改变")
43 },
44 focus(){
45 console.log("获得焦点")
46 },
47 blur(){
48 console.log("失去焦点")
49 },
50 confirm(){
51 console.log("点击完成按钮/回车键")
52 },
53 // 使用时 tap 和 click 只使用一个就好
54 click(){
55 console.log("单击事件")
56 },
57 tap(){
58 console.log("组件被触摸")
59 },
60 longpress(){
61 console.log("长时间按压")
62 },
63 //不推荐使用，请使用longpress
64 // longtap(){
65 // console.log("长时间触摸")
66 // }
67 touchstart(){
68 console.log("触摸开始")
69 },
70 touchend(){
71 console.log("触摸结束")
72 },
73 touchmove(){
74 console.log("手指移动")
75 },
76 //如打进电话， （暂时无法演示）
77 touchcancel(){
78 console.log("触摸被打断")
79 }
80 }
81 }
82 </script>
83
84 <style>
85
86 </style>