如果没有下载vue,可以用链接的方法进行体验:
<script src="https://cdn.jsdelivr.net/npm/vue@3.2.2"></script>
安装vue,直接输入命令即可   npm install -g @vue/cli@4.5.13 vue@3.2.2

 注意不要把$符号放在文件内

创建新项目,输入命令
vue init webpack my-project

填写详细信息,如项目名称,作者等即可.

 创建后 直接cd 进入项目 : cd 项目名字

创建一个页面,需要创建路由和视图,进入路由文件进行修改

修改路由文件后,创建对应的视图文件

 输入命令npm run serve  让项目运行起来

在浏览器输入网址即可看到项目视图对应的页面,如果没有修改视图文件,看到是官方的欢迎页面,并没有太多影响

 同样的,创建对应的视图文件,打开对应的页面,即可,v-for页面是这样的,

 打开浏览器输入网址后,看到的页面是这样的

增加v-if的视图页面,如图:

 打开v-if的网址,看到的页面是这样的:

 对于v-if和v-for的优先级比较,可以看一下:

 进入浏览器打开页面。看到:

在vue3中,当v-if与v-for一起使用时,v-if具有比v-for更高的优先级。也就是说,Vue.js会先执行v-if,再执行v-for。