vue条件渲染2
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div id="app">
<div v-if="vip==1">
<h1>这是VIP1的内容</h1>
</div>
<div v-else-if='vip==2'>
<h1>这是VIP2的内容</h1>
</div>
<div v-else>
<h1>这是普通用户的内容</h1>
</div> </div> <script type="text/javascript">
var app = new Vue({
el:'#app',
data:{
vip:2
},
methods:{ }
})
</script>
</body>
</html>
vue条件渲染2的更多相关文章
- Vue条件渲染
gitHub地址:https://github.com/lily1010/vue_learn/tree/master/lesson08 一 v-if显示单个元素 注意else只能跟在v-if或者v-s ...
- Vue#条件渲染
根据不同的条件,响应不同的事件. https://jsfiddle.net/miloer/zed5p1r3/ 可以用template来包装元素,当然浏览器的最终渲染结果不会包含它.我觉得主要用它来自定 ...
- [vue]vue条件渲染v-if(template)和自定义指令directives
条件渲染: v-if/template <div id="app"> <h1>v-show: display: none</h1> <di ...
- vue 条件渲染与列表渲染
本文是对官方文档的整理 因为 v-if 是一个指令,所以必须将它添加到一个元素上.但是如果想切换多个元素呢?此时可以把一个 <template> 元素当做不可见的包裹元素,并在上面使用 v ...
- (尚008)Vue条件渲染
1.test008.html <!DOCTYPE html><html lang="en"><head> <meta charset=&q ...
- vue 条件渲染 v-if v-show
1.要点 1.1 v-if 条件性地渲染一块内容 <h1 v-if="awesome">Vue is awesome!</h1> 附带 / v- ...
- vue 条件渲染v-if v-show
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- vue 条件渲染方式
1.通过class绑定 <div :class="{'div-class': this.align == 'center'}"></div> 对应的css ...
- vue.js选择if（条件渲染）详解
vue.js选择if(条件渲染)详解 一.总结 一句话总结: v-if <!DOCTYPE html> <html lang="en"> <head& ...
随机推荐
- Gitlab+Gitlab-CI+Docker实现持续集成(CI)与持续部署(CD)
写在前面 记录一下,一个自动化开发部署项目的构建过程与简单使用,实现真正的DevOps gitlab安装 步骤一:安装依赖 yum -y install git gcc glibc-static te ...
- 编程范式 --- 函数式编程（Funtional Programming，简称FP）
函数式编程(Funtional Programming,简称FP)是一种编程范式,也就是如何编写程序的方法论 主要思想:把计算过程尽量分解成一系列可复用函数的调用 主要特征:函数是"第一等公 ...
- poi实现excel的导入导出功能
Java使用poi实现excel的导入导出功能: 工具类ExcelUtil,用于解析和初始化excel的数据:代码如下 package com.raycloud.kmmp.item.service.u ...
- git 查看分支
1.查看本地分支 git branch 2.查看所有分支 git branch -a 2.查看所有分支及对应版本信息 git branch -va
- P3515 [POI2011]Lightning Conductor
首先进行一步转化 $a_j \leq a_i + q - sqrt(abs(i - j))$ $a_i + q \geq a_j + sqrt(abs(i-j))$ 即 $q = max (a_j + ...
- php-fpm启动，重启，退出
首先确保php-fpm正常安装,运行命令php-fpm -t输出查看: ##确定php-fpm配置正常 [root@iz2vcf47jzvf8dxrapolf7z php7.-Oct-::] NOTI ...
- 基于 HTML5 WebGL 的垃圾分类系统
前言 垃圾分类,一般是指按一定规定或标准将垃圾分类储存.分类投放和分类搬运,从而转变成公共资源的一系列活动的总称.分类的目的是提高垃圾的资源价值和经济价值,力争物尽其用.垃圾在分类储存阶段属于公众的私 ...
- VR中的Redirection
在虚拟现实(Virtual Reality,VR)中,很重要的一点就是用户的在虚拟环境中的漫游(navigation).除了固定视点的VR电影,一般的VR应用,特别是游戏或者其他交互式的应用,都会依赖 ...
- 多线程EventWaitHandle -戈多编程
在.NET的System.Threading命名空间中有一个名叫WaitHandler的类,这是一个抽象类(abstract),我们无法手动去创建它,但是WaitHandler有三个子类,这三个子类分 ...
- 各种常见文件的hex文件头
我们在做ctf时,经常需要辨认各种文件头,跟大家分享一下一些常见的文件头. 扩展名 文件头标识(HEX) 文件描述 123 00 00 1A 00 05 10 04 Lotus 1-2-3 spr ...