问题: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一起使用时的优先级的更多相关文章

  1. (vue.js)vue中引用了别的组件 ,如何使this指向Vue对象

    Vue中引用了别的组件 ,如何使this指向Vue对象 今天学习Vue组件传值, 通过创建Vue实例, 广播和监听实现传值, 但是传值之后无法直接将得到的值应用到Vue对象, 因为这相当于引用改了别的 ...

  2. Java 中无返回值的方法在使用时应该注意的问题

    Java 中的方法是形态多样的.无返回值的方法在使用时应该规避哪些问题呢? 一.不可以打印调用或是赋值调用,只能是单独调用(非常重要): 二.返回值没有,不代表参数就没有: 三.不能return一个具 ...

  3. VC++中解决“在查找预编译头使用时跳过”的方法

    Visual C++ Concepts: Building a C/C++ ProgramCompiler Warning (level 1) C4627Error Message": sk ...

  4. java中 try catch finally和return联合使用时,代码执行顺序的小细节

    代码1测试 public static void main(String[] args) { aa(); } static int aa() { try { int a=4/0; } catch (E ...

  5. mybatis :xml文件中传入参数和if标签结合使用时要点

    org.mybatis.spring.MyBatisSystemException: nested exception is org.apache.ibatis.reflection.Reflecti ...

  6. Oracle 中的一些重要V$ 动态性能视图,系统视图和表

    v$database:数据库的信息,如数据库名,创建时间等. v$instance 实例信息,如实例名,启动时间. v$parameter 参数信息,select * from v$parameter ...

  7. 如何对多个文件进行MODELSIM仿真? (由于是一个很大的项目,不可能把所有MODULE都放在一个文件里。 如何在ModelSim中对多个.V文件进行仿真?)

    可以将所有要编译的所有文件的名字做一个list.新建一个文本文档,重命名为vflist vflist内容例子如下(src为文件夹):src/base_addr_chk.vsrc/config_mux. ...

  8. 【转】 Oracle 中的一些重要V$ 动态性能视图,系统视图和表

    v$database:数据库的信息,如数据库名,创建时间等. v$instance 实例信息,如实例名,启动时间. v$parameter 参数信息,select * from v$parameter ...

  9. vue中的vue-cli

    在前面的学习过程中我相信你们已经对vue有了一定的了解,现在我们来看一下vue中的vue-cli. 学习这个我们首先需要的是node环境的,如果你的网络环境慢的话建议安装淘宝镜像,在cmd中输入 np ...

  10. Vue学习笔记七:Vue中的样式

    目录 两种样式 class样式 内联样式 两种样式 Vue中使用样式方式有两种,一种是class样式,一种是内联样式也就是style class样式 class样式使用的方式有5种,HTML如下 &l ...

随机推荐

  1. redis(4)String字符串

    前言 Redis中有5大数据类型,分别是字符串String.列表List.集合Set.哈希Hash.有序集合Zset,本篇介绍Redis的字符串String Redis字符串 String是Redis ...

  2. Java 文本检索神器 "正则表达式"

    Java 文本检索神器 "正则表达式" 每博一文案 在我们短促而又漫长的一生中,我们在苦苦地寻找人生的幸福,可幸福往往又与我们失之交臂, 当我们为此而耗尽宝贵的.青春年华,皱纹也悄 ...

  3. ELK 一些截图

    一.背景 集成环境中,多台服务器会存在多份日志,不方便查阅 · 二.原理 三.配置原理 Logstash是安装在服务器上的,相当于读取本地日志,然后输出到ES服务器,kibana会从ES服务器读取数据 ...

  4. eclipse项目转idea项目

    背景:用习惯了idea再去用eclipse实在用的不习惯,于是将老的eclipse项目导入到eclipse,网上有很多教程,看了很多博客都不行,一直报错,各种报错,现在终于好了,我们一起来看看怎么将e ...

  5. bzoj5000+的洛谷题号

    前言 闲得没事把 bzoj5000+ 在 Luogu 上可找到的题面整理了一下-- 对于我,bzoj 连账号都没有,所以肯定是不清楚 bzoj 题目总数的--因此其实就是手动翻查. 工作量很大,基本不 ...

  6. QQ空间数据抓取

    title: QQ空间数据抓取 author: 杨晓东 permalink: QQ空间数据抓取 date: 2021-10-02 11:27:04 categories: - 嗯哼 tags: - 无 ...

  7. 已拦截跨源请求:同源策略禁止读取位于 http://192.168.2.104:8080/sockjs-node/info?t=1615356410656 的远程资源。(原因:CORS 请求未能成功)

    本人用的是火狐浏览器 是由于版本过低导致的被拦截,更新火狐为最新版本即可

  8. PGSQL新建临时表

    初始化临时表,会话结束后自动删除 普通写法 CREATE TEMP TABLE tmp_student( id VARCHAR(10), name VARCHAR(3O), age INTEGER ) ...

  9. Nacos配置管理

    一.在Nacos添加公共配置 二.项目中读取方式 1. 引入nacos-config依赖 首先,在要使用 nacos 来管理配置的服务中,引入nacos-config 依赖: <!--nacos ...

  10. linux启用ipv4转发功能

    一.临时生效,重启失效1.sysctl -w net.ipv4.ip_forward=12.echo 1 > /proc/sys/net/ipv4/ip_forward二.永久生效修改 /etc ...