template cannot be keyed. Place the key on real elements instead.
template cannot be keyed. Place the key on real elements instead.
一、总结
一句话总结:
原因:vue不支持在 template 元素上绑定属性。比如这里想绑定 key 属性就不行。
解决方法:可以改成div或者 不使用template元素做for循环
二、cannot be keyed. Place the key on real elements instead.
转自或参考:cannot be keyed. Place the key on real elements instead.
https://blog.csdn.net/tangxinzhuan/article/details/89187057
<--! 以下代码编译的时候提示错误 -->
<template v-for="(m, key) in menus" :key="m.id">
{{m.menuName}}
</template>
原因:
不支持在 <template> 元素上绑定属性。比如这里想绑定 key 属性就不行。
解决办法:
改用 <div> 元素。
<div v-for="(m, key) in menus" :key="m.id">
{{m.menuName}}
</div>
template cannot be keyed. Place the key on real elements instead.的更多相关文章
- 【vuejs深入二】vue源码解析之一,基础源码结构和htmlParse解析器
写在前面 一个好的架构需要经过血与火的历练,一个好的工程师需要经过无数项目的摧残. vuejs是一个优秀的前端mvvm框架,它的易用性和渐进式的理念可以使每一个前端开发人员感到舒服,感到easy.它内 ...
- 前端开发--vue开发部分报错指南
前期开发过程中 [Vue warn]: Error in render: "TypeError: Cannot read property '0' of undefined". 解 ...
- Vue 源码解读(8)—— 编译器 之 解析(上)
特殊说明 由于文章篇幅限制,所以将 Vue 源码解读(8)-- 编译器 之 解析 拆成了上下两篇,所以在阅读本篇文章时请同时打开 Vue 源码解读(8)-- 编译器 之 解析(下)一起阅读. 前言 V ...
- 微信小程序 - template和include详细描述
演示 index.wxml <!-- 内部模板 --> <template name="all"> {{a}} {{b}} </template> ...
- WPF Style和Template
WPF中的Style类似于Web应用程序中的CSS,它是控件的一个属性,属于资源的一种. ControlTemplate和DataTemplate区别: ControlTemplate用于改变控件原来 ...
- map以自定义类型当Key
关于map的定义: template < class Key, class T, class Compare = less<Key>, class Allocator = alloc ...
- intellij idea 设置Live Template快速生成自定义代码块
一.设置 类似于宏,话不多少,上步骤 File----->Setting 选择Live Template 新建触发规则 新建触发key 输入模版text 选择在哪个环境触发 选java 如果是其 ...
- Vue.js 的几点总结Watchers/router key/render
Vue.js 的几点总结,下面就是实战案例,一起来看一下. 第一招:化繁为简的Watchers 场景还原: 1 2 3 4 5 6 7 8 created(){ this.fetchPostLis ...
- 自定义django的Template context processors
简要步骤: 1.编辑一个函数: def media_url(request): from django.conf import settings return {'media_url': settin ...
随机推荐
- 20、解决Vue使用bus兄弟组件间传值,第一次监听不到数据
1.新建bus.js文件: import Vue from 'vue' export default new Vue; 2.在需要通信组件A,B中引入bus: A组件: import Bus from ...
- XmlDocument.load 读文件报异常:文件正被其它线程使用,解决方法
string filePath = Form1.getProjectFilePath(); System.Xml.XmlDocument xmlDoc = new System.Xml.XmlDocu ...
- XenCenter安装VM
XenServer是服务器"虚拟化系统".系统设置为Linux_x86-64即可安装XenServer 和VMware ESX/ESXi有点不同的是,XenServer 不能在Xe ...
- springboot+MessageSource实现国际化
1.springboot自带,不需要引入任何依赖 2.在resource下建立:i18n/messages.properties 3.在application.yml增加以下内容 spring: ap ...
- SpringCloud SpringBoot 前后端分离企业级微服务架构源码赠送
基于SpringBoot2.x.SpringCloud和SpringCloudAlibaba并采用前后端分离的企业级微服务敏捷开发系统架构.并引入组件化的思想实现高内聚低耦合,项目代码简洁注释丰富上手 ...
- Executor的线程代码
package com.open1111; import java.util.concurrent.ExecutorService;import java.util.concurrent.Execut ...
- Golang: 读取文件并统计内容
上次我们从命令行接收用户输入,并统计了每次输入内容出现的次数,今天对程序加以改造,使其能够读取文件内容,并统计每行文本出现的次数. 首先,我们把接收输入的逻辑封装成一个函数: // scan.go p ...
- Windows Server 2008 R2 忘记密码的处理方法
这篇文章主要介绍了Windows Server 2008 R2 忘记密码的处理方法,一般两种方法,一种是软件方法一种是通过系统安装盘实现的,这里久违大家分享一下需要的朋友可以参考下 遗忘Windows ...
- Selenium_webdriver+java+TestNG入门UI自动化
web ui自动化测试需要的工作:Eclipse(JAVA编译器).selenium(库文件).webdriver(浏览器驱动).testng的lib; 如图: 第一步:先部署坏境,下载seleniu ...
- 20180520模拟赛T1——math
[问题描述] 小美有 n 个点 m 条边. 让你给每个点一个正整数编号. 每条边有两个属性,相连的两个点的编号的 GCD 和 LCM. 题目保证整张图连通. 让你构造出一个编号. [输入格式] 从文件 ...