vue3-CSDN博客

1  <button @click="clickBtn('撩课', $event)">点我</button>
2  clickBtn(args, event){
3        console.log(args);//参数
4        console.log(event);
5   },

1 事件修饰符
2  <a href="http://www.itlike.com" @click.prevent="aClick">撩课</a>
3 
4  <div style="width: 100px; height: 100px; background-color:red;"         @click="divClick">
5           <button @click.stop="btnClick">点我</button>
6  </div>

1 <h3>按键修饰符</h3>
2 <input type="text" @keyup.enter="dealKey">
3  <!-- 按键修饰符 回车事件-->
4 
5 dealKey(event){
6                 console.log(event['keyCode']);
7             }

 1 过滤器
 2 
 3 // 注册全局过滤器
 4 Vue.filter('wholeMoneyFormat', (value)=>{
 5    return '¥' + Number(value).toFixed(4);
 6 });
 7 
 8  <p>{{money | wholeMoneyFormat}}</p>
 9 <p>{{page | wholeMoneyFormat}}</p>
10 
11 
12 
13 // 局部过滤器
14         filters: {
15             moneyFormat(value){
16                 return '¥' + Number(value).toFixed(2);
17             },
18             timeFormat(value, format='YYYY-MM-DD HH:mm:ss'){
19                 return moment(value).format(format);  //moment是个插件import moment from 'moment'

20             }
21         }
22 
23 <p>{{money | moneyFormat}}</p>
24 <p>{{page | moneyFormat}}</p>
25 
26 <h3>格式化日期</h3>
27 <p>{{time | timeFormat}}</p>
28 <p>{{time | timeFormat('YYYY-MM-DD')}}</p>
29 <p>{{time | timeFormat('HH:mm:ss')}}</p>