key也可以用于强制替换元素/组件而不是重复使用它。当你遇到如下场景时它可能会很有用:

  • 完整地触发组件的生命周期钩子
  • 触发过渡

例如:

<transition>
<span :key="text">{{ text }}</span>
</transition>

当 text 发生改变时,<span> 会随时被更新,因此会触发过渡。

vue key 的另外一个用法 过度的更多相关文章

  1. Vue组件的is具体用法

    1.为什么要使用is 在vue的官网组件部分中,有明确的描述:当使用 DOM 作为模板时 (例如,使用 el 选项来把 Vue 实例挂载到一个已有内容的元素上),你会受到 HTML 本身的一些限制,因 ...

  2. 详解Vue中watch的高级用法

    我们通过实例代码给大家分享了Vue中watch的高级用法,对此知识点有需要的朋友可以跟着学习下. 假设有如下代码: <div> <p>FullName: {{fullName} ...

  3. vue 中 命名视图的用法

    今天主要记录  vue中命名视图的用法 先奉上官网网址:https://router.vuejs.org/zh/guide/essentials/named-views.html 一般情况下,一个页面 ...

  4. vue第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法)

    第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法) #课程目标 了解 vue 框架的特点 掌握创建 vue 实例 掌握 data ...

  5. vue element-ui怎样提炼一个自己写的js当作公共js

    vue element-ui怎样提炼一个自己写的js当作公共js请教一下各位大神,我刚刚触摸vue element-ui几天,写的一个清晰检索的input框,现在需当作项目公共的部分,可遭需的html ...

  6. vue 学前班002(创建一个实例)

    创建一个Vue实例 我们之前说过,Vue是数据驱动视图的,只要model(模型层)的数据改变了,Vue就会帮我们改变视图上显示的内容,不用我们自己去动手写代码更新.那么,它是怎么做到的,我们的代码要怎 ...

  7. PHP 获取数组随意下标key的上一个prev和下一个next下标值

    PHP 获取数组随意下标key的上一个prev和下一个next下标值 <? php $xoops[1] = '小'; $xoops[2] = '孩'; $xoops[3] = '子'; $xoo ...

  8. VUE -- vue.js中$watch的用法示例

    Vue.js 提供了一个方法 watch,它用于观察Vue实例上的数据变动.对应一个对象,键是观察表达式,值是对应回调.值也可以是方法名,或者是对象,包含选项. 在实例化时为每个键调用 $watch( ...

  9. WPF x:key和x:name用法

    WPF x:key和x:name用法 x:Key用在xaml Resources,ResourceDictionary需要key来访问 x:Name用在ResourceDictionary以外任何地方 ...

随机推荐

  1. linux系统mysql密码修改脚本

    编写了一个适用于阿里云linux系统 mysql密码修改脚本,使用阿里云提供的一键安装包配置后,如果account.log文件删除,并且忘记mysql密码时,可以通过脚本来重置mysql密码. 附:一 ...

  2. LAMP第二部分apache的配置

    1. 下载discuz! mkdir /data/wwwcd /data/wwwmv /root/Discuz_X3.2_SC_GBK.zip .wget http://download.comsen ...

  3. 通过sql查询rman备份信息

    通过sql查询rman备份信息 查看所有备份集 SELECT A.RECID "BACKUP SET", A.SET_STAMP, DECODE (B.INCREMENTAL_LE ...

  4. NOIP试题解析

    NOIP试题解析           by QTY_YTQ noip2010关押罪犯(并查集) 题意是有n个罪犯关在两个监狱中,其中有m对罪犯有仇恨关系,如果有仇恨的罪犯关在一起会产生一定影响力的事件 ...

  5. xctf --Hctf2014 Quals write up

    描述 猫流大大发现一个女神,你能告诉我女神的名字么(名字即是flag) nvshen.zip Solution: Extract the file and we could find a txt wh ...

  6. Surface机制(SurfaceFlinger服务)

    Android系统Surface机制的SurfaceFlinger服务的线程模型分析http://blog.csdn.net/luoshengyang/article/details/8062945

  7. 外星千足虫(bzoj 1923)

    Description Input 第一行是两个正整数 N, M. 接下来 M行,按顺序给出 Charles 这M次使用“点足机”的统计结果.每行 包含一个“01”串和一个数字,用一个空格隔开.“01 ...

  8. [Codeforces Round #351 Div. 2] 673A Bear and Game

    A. Bear and Game time limit per test 2 seconds memory limit per test 256 megabytes input standard in ...

  9. .NET and php

    原文发布时间为:2011-12-29 -- 来源于本人的百度文章 [由搬家工具导入] http://www.php-compiler.net/blog/2011/phalanger-3-0

  10. 解决Navicat 报错:1130-host ... is not allowed to connect to this MySql server,MySQL不允许从远程访问的方法

    1. 改表法. 可能是你的帐号不允许从远程登陆,只能在localhost.这个时候只要在localhost的那台电脑,登入mysql后,更改 "mysql" 数据库里的 " ...