多语言展示
当前在线:1215今日阅读:165今日分享:48

第一个VUE,如何实现跑马灯效果

vue是目前最为流行的前端框架之一,学习起来也极为的简单,本章讲解vue实现跑马灯效果
工具/原料

Hbuilder X工具

方法/步骤
1

1、打开Hbuilder、建立一个项目(引入vue.js的包,vue的官网可直接下载)、目录结构如下

2

2、用引入vue.js

3

3、建立两个按钮

4

4、添加vue的渲染

5

5、添加click事件,以及字符串拆分,实现大致效果,如图

6

6、设置定时器、以及暂时效果

7

7、防止重复点击定时器

8

8、代码如下:  测试第一个VUE(跑马灯效果)

{{msg}}

注意事项

感谢阅读、欢迎批评指导

推荐信息