如何使用Vue.js获取奇数和偶数并进行分类展示

 时间:2024-10-13 21:03:37

1、第一步,双击打开HBuilder工具,新建Web项目并在项目指定目录下创建页面,如下图所示:

如何使用Vue.js获取奇数和偶数并进行分类展示

2、第二步,在<title></title>标签下方,引入Vue.js核心的JavaScript文件,如下图所示:

如何使用Vue.js获取奇数和偶数并进行分类展示

3、第三步,在<body></body>标签内,插入一个无序列表,列表有两个子项,分别使用v-for指令绑定数据,如下图所示:

如何使用Vue.js获取奇数和偶数并进行分类展示

4、第四步,在<ul></ul>标签下方,插入<script></script>,并在这个标签内编写data和判断奇数和偶数的方法函数,如下图所示:

如何使用Vue.js获取奇数和偶数并进行分类展示

5、第五步,保存代码并预览界面,这时打开浏览器控制台,发现报错了,如下图所示:

如何使用Vue.js获取奇数和偶数并进行分类展示

6、第六步,将v-for指令中的num改为digits,然后再次保存预览页面,可以看到效果,如下图所示:

如何使用Vue.js获取奇数和偶数并进行分类展示
  • css如何让span元素带边框
  • phpstudy运行mysql时出现1055怎么办
  • FrontPage技巧:[15]如何在网页中制作表格框架
  • 如何利用HTML5和CSS3制作图片列表并展示效果
  • Dreamweaver如何将Git存储库与站点关联
  • 热门搜索
    什么是阴阳人 约是什么意思 维生素b的食物 水溶性维生素 考驾照体检什么 运动会开幕式 7月24日是什么节日 喝什么解辣 黔驴技穷什么意思 九月初九是什么节