vue.js怎样使用vue-if else

 时间:2024-10-15 00:15:06

1、如图所示,先创建一个vue实例以便待会演示vue中if和else语句的使用。

vue.js怎样使用vue-if else

2、然后在data中设置一个属性并且该属性为true。然后把这个属性用vue-if来绑定即可。

vue.js怎样使用vue-if else

3、接着打开浏览器便会看到vue-if里面的内容可以显示在网页中。

vue.js怎样使用vue-if else

4、接着把属性值改为false再刷新浏览器看看vue-if所在的标签是否还会显示。

vue.js怎样使用vue-if else

5、如图所示,可以看到vue-if所在标签粝简肯惧内容就没有显示出来。这样我们就可以知道当vue-if里面的结果为true时便会显示内容了。反之vue-if则不会显示内容了。

vue.js怎样使用vue-if else

6、如果想要使用else语句的用法则可以在vue-if后面直接使用vue-else指令即可哦。

vue.js怎样使用vue-if else

7、这样,当vue-if条件不成立则会显示vue-else所在标签的内容了哦。

vue.js怎样使用vue-if else

8、特别注意的是true和false不需要加引号噢。还有便是vue-else要在vue-if指令之后噢。

vue.js怎样使用vue-if else
  • 火舞二闪怎么操作
  • 简简单单做白果方法
  • 如何处理好青春叛逆期与父母的关系
  • 荒野行动无声音怎么解决
  • 怎么使用lol换肤魔盒
  • 热门搜索
    维生素e的祛斑方法 周公解梦原版大全版2345 燕京理工学院怎么样 扒肘子的家常做法 猪心怎么做好吃 红烧蹄膀的家常做法 论证方法的作用 背景图片大全 松子玉米的家常做法 结肠炎最佳治疗方法