vue 控制视图
<!--第一种:点击改变容器的值-->
<li>
<a href="javascript:void(0)" @click="state.box_status = 'language'">语言</a>
</li>
<li>
<a href="javascript:void(0)" @click="state.box_status = 'equipment'">设备</a>
</li> <!--与容器的值相对应则显示-->
<div v-show="state.box_status == 'language'">
视图一
</div>
<div v-show="state.box_status == 'equipment'">
视图二
</div>
<!--第二种:点击改变容器的值-->
<select v-model="state.user_arg">
<option value="1">添加参数</option>
<option value="2">替换所有参数</option>
<option value="3">移除与以下内容完全一致的参数</option>
</select>
<div v-show="state.user_arg == 1">
视图一
</div> <div v-show="state.user_arg == 2">
视图二
</div> <div v-show="state.user_arg == 3">
视图三
</div>
<!--如果判断语句少写一个等号,会报 You may have an infinite update loop in a component render function 大意是无限更新循环--> 第一次写好紧张
vue 控制视图的更多相关文章
- vue 路由视图,router-view嵌套跳转
实现功能:制作一个登录页面,跳转到首页,首页包含菜单栏.顶部导航栏.主体,标准的后台网页格式.菜单栏点击不同菜单控制主体展示不同的组件(不同的页面). 配置router-view嵌套跳转需要准备两个主 ...
- laravel4通过控制视图模板路劲来动态切换主题
通过控制视图模板路劲来动态切换主题 App::before(function($request) { $paths = Terminal::isMobile() ? array(__dir__.'/v ...
- vue命名视图实现经典布局
vue命名视图实现经典布局 <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...
- angular学习笔记(八)-控制视图显示隐藏
本篇介绍angular控制视图的显示和隐藏: 通过给元素添加ng-show属性或者ng-hide属性来控制视图的显示或隐藏: ng-show: 绑定的数据值为true时,显示元素,值为false时,隐 ...
- 035——VUE中表单控件处理之使用vue控制select操作文字栏目列表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 034——VUE中表单控件处理之使用vue控制radio表单的实例操作
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 031——VUE中表单控件处理之使用vue控制input和textarea表单项
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 013——VUE中多种方式使用VUE控制style样式属性
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 【Android】ViewModel+LiveData:更加直接地控制视图的方式
目录 LiveData 前言 使用ViewModel+LiveData LiveData 前言 ViewModel通过将UI data保存在ViewModel类实例的内部,从而大大地将MVC中的 ...
随机推荐
- mybatis 动态sql和参数
mybatis 动态sql 名词解析 OGNL表达式 OGNL,全称为Object-Graph Navigation Language,它是一个功能强大的表达式语言,用来获取和设置Java对象的属性, ...
- mysql将查询结果导出
一.首先确认当前数据库设置导出是允许的 show variables like '%secure%'; 如果是null则代表不允许,这时可以用命令修改,或者直接修改数据库配置文件my.ini,在其中添 ...
- Python连接MySQL数据库的多种方式
上篇文章分享了windows下载mysql5.7压缩包配置安装mysql 后续可以选择 ①在本地创建一个数据库,使用navicat工具导出远程测试服务器的数据库至本地,用于学习操作,且不影响测试服务器 ...
- sublime和vscode 格式化Json ——两步走
目录 1.问题来源 2.sublime安装插件方式 3.使用方式 4.扩展:对于软件vscode 1.问题来源 最近做数据匹配任务,需要生成很多json文件,但是每个json文件又太大,想要逐字段(k ...
- 老男孩Python九期全栈学习笔记3
day3 1.上周五内容回顾 格式化输出:%s %d %%:输出% 编码: ASCII码只能显示英文.数字和特殊字符. Unicode:万国码,最开始使用16位表示一个字符,中文不够,后来使用4个字节 ...
- python数据结构与算法之问题求解
懂得计算机的童鞋应该都知道,一条计算机程序由数据结构跟算法两大部分组成.所以,其实不管你使用哪种计算机语言编写程序,最终这两部分才是一个程序设计的核心.所以,一个不懂得数据结构与算法的程序员不是一个好 ...
- 图片转成Base64
var img = "imgurl";//imgurl 就是你的图片路径 function getBase64Image(img) { var canvas = document. ...
- Cognos集成至portal平台运行报表时只出“#”
1. 问题描述 报表集成到平台后,运行报表过程中,当多次运行后,页面只显示“#” 2. 问题分析 这是因为浏览器筛选器限制问题 3. 解决方案 在IE浏览器设置中,Internet选项-安全-自定义级 ...
- 在Postman中使用不受信任的SSL证书
阅读目录 第一种方案——临时添加到受信任的证书颁发机构: 第二种方案——永久添加到受信任的证书颁发机构: add by zhj: 在http://www.cnblogs.com/ajianbeyour ...
- lumion物体系统,导入模型6.3
选择物体后可以改变它的颜色 “导入”“导入新模型.”su中模型分正面反面.在lumion中显示是不一样的.正面是可以显示出来的,反面就是透明的,lumion只能识别不同的材质,所以在su中要用不同的颜 ...