热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

[Vue.js3.0]Migration–vifvs.vforPrecedence

# v-if vs. v-for Precedence breaking# OverviewBREAKING: If used on the same elem


# v-if vs. v-for Precedence



breaking




# Overview




  • BREAKING: If used on the same element, v-if will have higher precedence than v-for



# Introduction

Two of the most commonly used directives in Vue.js are v-if and v-for. So it's no surprise that there comes a time when developers want to use both together. While this is not a recommended practice, there may be times when this is necessary, so we wanted to provide guidance for how it works.


# 2.x Syntax

In 2.x, when using v-if and v-for on the same element, v-for would take precedence.


# 3.x Syntax

In 3.x, v-if will always have the higher precedence than v-for.


# Migration Strategy

It is recommended to avoid using both on the same element due to the syntax ambiguity.

Rather than managing this at the template level, one method for accomplishing this is to create a computed property that filters out a list for the visible elements.


# See also



  • List Rendering - Displaying Filtered/Sorted Results

  • List Rendering - v-for with v-if



推荐阅读
author-avatar
有海的地方最美_171
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有