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中的 ...
随机推荐
- 如何系统地自学 Python?
最近开始系统的学习Python,以及整理的一些资料.github记录着个人自学 Python 的过程,持续更新.欢迎大家一起来完善这个自学Python学习的项目,给后来者一个参考的学习过程.githu ...
- [ Servlet / JSP ] J2EE Web Application 中的 JSESSIONID 是什么?
JSESSIONID is a cookie in J2EE web application which is used in session tracking. Since HTTP is a st ...
- HBase表数据的转移之使用自定义MapReduce
目标:将fruit表中的一部分数据,通过MR迁入到fruit_mr表中 Step1.构建ReadFruitMapper类,用于读取fruit表中的数据 package com.z.hbase_mr; ...
- ArcSDE10.1配置Oracle 监听器来使用SQL操作ST_Geometry(个人改动版)
发了两天的时间来解决配置Oracle 监听器来使用SQL操作ST_Geometry的配置,网上搜索一大片,结果真正找到的只有方法可用,下面把这个方法我个人在总结下. ArcSDE10.1配置Oracl ...
- 将一个JSON数组[{},{},{}]按一定规则合并到另一个JSON数组[{},{},{}]
// 将一个JSON数组[{},{},{}]按一定规则合并到另一个JSON数组[{},{},{}] // Object.assign方法的第一个参数是目标对象,后面的参数都是源对象. var list ...
- Vue之添加全局变量
定义全局变量 原理: 设置一个专用的的全局变量模块文件,模块里面定义一些变量初始状态,用export default 暴露出去,在main.js里面使用Vue.prototype挂载到vue实例上面或 ...
- Arthur and Questions CodeForces - 518E (贪心模拟)
大意: 给定序列$a$, 某些位置为'?', 求给'?'赋值使得序列$(a_1+a_2+...+a_k,a_2+a_3+...+a_{k+1},...)严格递增, 且$\sum|a_i|$最小. 化简 ...
- C#流程控制语句--迭代语句(while,do....while, for , foreach)
迭代语句:有的时候,可能需要多次执行同一块代码.函数中的第一个语句先执行,接着是第二个语句,依此类推. 迭代语句:while(先检查后执行) while(条件表达式 bool类型) { 代码语句 } ...
- HDFS的上传与下载(put & get)
最近在做一个小任务,将一个CDH平台中Hive的部分数据同步到另一个平台中.毕竟我也刚开始工作,在正式开始做之前,首先进行了一段时间的练习,下面的内容就是练习时写的文档中的内容.如果哪里有错误或者疏漏 ...
- leetcode 78,236,300
---恢复内容开始--- 2018.3.16目前已刷27题,打卡记录有意思的题目. leetcode78 subsets 思路1:DFS遍历子集,每遇到一个数就把该数加上原来的子集变成新的子集. cl ...