简单的vue入门案例

一、 简单入门Hello World案例

简单的vue入门案例_第1张图片

二、插值表达式

简单的vue入门案例_第2张图片

三、点击事件

简单的vue入门案例_第3张图片

四、按键事件

1.如果按下不是 0 - 9 则阻止事件执行

简单的vue入门案例_第4张图片

2.打印按下什么按键

简单的vue入门案例_第5张图片

五、鼠标事件

1.打印绝对坐标

简单的vue入门案例_第6张图片

2.打印相对坐标

简单的vue入门案例_第7张图片

3.鼠标mousemove

简单的vue入门案例_第8张图片
简单的vue入门案例_第9张图片

4. 阻止冒泡(阻止事件的传播)

简单的vue入门案例_第10张图片
简单的vue入门案例_第11张图片

六、事件修饰符

1.阻止跳转页面v-on:submit.prevent

@click == v-on:click
简单的vue入门案例_第12张图片

2.阻止向上传递@click.stop

简单的vue入门案例_第13张图片

七、按键修饰符

1.指定键盘按下的键@keyup.ctrl.+字母对应的ASICC

简单的vue入门案例_第14张图片

你可能感兴趣的:(vue,vue,vue简单入门案例)