Vue中v-if和v-for一起使用时的优先级
问题:Vue2.0中v-if和v-for一起使用时报错,怎么解决呢?
代码和报错信息如下
原因和解决办法:
在处于同一节点的时候,v-for 优先级比 v-if 高。这意味着 v-if 将分别重复运行于每个 v-for 循环中。先运行v-for 的循环,然后在每一个v-for 的循环中,再进行 v-if 的条件对比。所以不推荐v-if和v-for同时使用。
所以把v-if放在外层标签上面即可(上面的例子把v-if放在el-row上)
- 在 vue 2.x 中,在一个元素上同时使用 v-if 和 v-for 时,v-for 会优先作用。
- 在 vue 3.x 中,v-if 总是优先于 v-for 生效。
Vue中v-if和v-for一起使用时的优先级的更多相关文章
- (vue.js)vue中引用了别的组件 ,如何使this指向Vue对象
Vue中引用了别的组件 ,如何使this指向Vue对象 今天学习Vue组件传值, 通过创建Vue实例, 广播和监听实现传值, 但是传值之后无法直接将得到的值应用到Vue对象, 因为这相当于引用改了别的 ...
- Java 中无返回值的方法在使用时应该注意的问题
Java 中的方法是形态多样的.无返回值的方法在使用时应该规避哪些问题呢? 一.不可以打印调用或是赋值调用,只能是单独调用(非常重要): 二.返回值没有,不代表参数就没有: 三.不能return一个具 ...
- VC++中解决“在查找预编译头使用时跳过”的方法
Visual C++ Concepts: Building a C/C++ ProgramCompiler Warning (level 1) C4627Error Message": sk ...
- java中 try catch finally和return联合使用时,代码执行顺序的小细节
代码1测试 public static void main(String[] args) { aa(); } static int aa() { try { int a=4/0; } catch (E ...
- mybatis :xml文件中传入参数和if标签结合使用时要点
org.mybatis.spring.MyBatisSystemException: nested exception is org.apache.ibatis.reflection.Reflecti ...
- Oracle 中的一些重要V$ 动态性能视图,系统视图和表
v$database:数据库的信息,如数据库名,创建时间等. v$instance 实例信息,如实例名,启动时间. v$parameter 参数信息,select * from v$parameter ...
- 如何对多个文件进行MODELSIM仿真? (由于是一个很大的项目,不可能把所有MODULE都放在一个文件里。 如何在ModelSim中对多个.V文件进行仿真?)
可以将所有要编译的所有文件的名字做一个list.新建一个文本文档,重命名为vflist vflist内容例子如下(src为文件夹):src/base_addr_chk.vsrc/config_mux. ...
- 【转】 Oracle 中的一些重要V$ 动态性能视图,系统视图和表
v$database:数据库的信息,如数据库名,创建时间等. v$instance 实例信息,如实例名,启动时间. v$parameter 参数信息,select * from v$parameter ...
- vue中的vue-cli
在前面的学习过程中我相信你们已经对vue有了一定的了解,现在我们来看一下vue中的vue-cli. 学习这个我们首先需要的是node环境的,如果你的网络环境慢的话建议安装淘宝镜像,在cmd中输入 np ...
- Vue学习笔记七:Vue中的样式
目录 两种样式 class样式 内联样式 两种样式 Vue中使用样式方式有两种,一种是class样式,一种是内联样式也就是style class样式 class样式使用的方式有5种,HTML如下 &l ...
随机推荐
- JZOJ 4872.集体照
\(\text{Problem}\) 一年一度的高考结束了,我校要拍集体照.本届毕业生共分 \(n\) 个班,每个班的人数为 \(A_i\).这次拍集体照的要求非常奇怪:所有学生站一排,且相邻两个学生 ...
- C# HttpClient使用和注意事项,.NET Framework连接池并发限制
System.Net.Http.HttpClient 类用于发送 HTTP 请求以及从 URI 所标识的资源接收 HTTP 响应. HttpClient 实例是应用于该实例执行的所有请求的设置集合,每 ...
- 了解舵机以及MG996R的控制方法
了解舵机以及MG996R的控制方法 1.舵机基础知识: 舵机是遥控航空.航天模型控制动作,改变方向的重要组成部件,舵机是一种位置(角度)伺服的驱动器. 舵机主要适用于那些需要角度不断变化并可以保持的控 ...
- Spring MVC + Webapp 项目显示 404 错误
这是因为 Tomcat 版本,把 Tomcat10 换成 Tomcat9 就可以解决这个问题了.下面是我正在做的一个 Spring MVC 入门案例,因为 Tomcat 10,DispatcherSe ...
- dotnet core+nginx+supervisor
1.前提准备 安装虚拟机,安装CentOS,有云服务器的直接用云服务器就行 本地安装 xshell.xftp 2.nginx配置静态页面 我们先学习一下使用nginx配置一个静态页面,一步一步来深入 ...
- Oracle DataGuard 出现 GAP 修复
下面我们通过实验来进行演示如何修复: 一.主库切几个最新的归档,然后手工删掉,重新开启DG同步. 1.备库关闭应用日志和数据库 SQL> ALTER DATABASE RECOVER MANAG ...
- 富士胶片2105N打印机安装说明
打开驱动文件,执行软件 自定义安装驱动 手动输入IP地址 下一步安装完成 自定义安装扫描软件 选择print & scan 下一步安装完成
- CLIP改进工作串讲(上)学习笔记
看了跟李沐学AI系列朱毅老师讲的CLIP改进工作串讲,这里记录一下. 1.分割 分割的任务其实跟分类很像,其实就是把图片上的分类变成像素级别上的分类,但是往往图片上能用的技术都能用到像素级别上来.所以 ...
- Matplotlib 实现画中画
需要导入的包 inset_axes 要实现画中画,即在原画轴上添加新轴,需要用到mpl_toolkits.axes_grid1.inset_locator的inset_axes. 基本用法 new_a ...
- SQLServer 查询所有外键关联表信息
有时候需要清除一些数据,但是总会有一些外键关联多加阻拦,下面是一些外键关联查询,方便更快捷有效的查询到需要处理的外键信息. 一.外键信息 查询列从左到右分别是: 外键约束名,子表名,外键列名,父表名 ...