首页 > 其他分享 >Vue2项目开发时遇到：<template v-for> key should be placed on the <template> tag

Vue2项目开发时遇到：<template v-for> key should be placed on the <template> tag

时间：2023-06-07 11:45:19浏览次数：59

标签：key should tag Vue2 template Vue3

问题缘由：

Vue2和Vue3中，对待template中存在v-for行为的组件正好相反

Vue2中key必须写在子元素中，Vue3中key必须写在template中，不然会报错

使用volar插件，使用Vue3语法检测代码，导致错误

解决方案：

1、禁用volar

2、貌似可以修改配置项，但尚未尝试

标签：key,should,tag,Vue2,template,Vue3
From： https://www.cnblogs.com/Delusional-man/p/17462925.html

git报错would clobber existing tag
使用vscode拉取代码出现报错：解决问题如下：1.在terminal直接输入gitpull完成对代码的拉取，代码虽然拉取了，但是vscode的git工具还是不能用2.在terminal输入gitfetch--tags-f，先完成对本地代码tag的强制更新。3.再使用vscode的git工具拉取代码 ......
Vue2知识点简要
一、双向绑定原理Vue2采用的是观察者-发布订阅模式，利用Object.defineProperty实现对数据已定义属性的监控(定义观察者模式)，编译DOM时解析v-model等属性以及对input框等注册事件实现UI和JS的交互(也就是注册发布订阅这模式)；详细的是主要是定义一个Observe类实现对象......
vue2插槽的透传
多组件嵌套的情况下，有时候会希望父组件向孙子组件（或者更小的辈分）的slot中插入内容，显然，这需要在孙子组件里面用<slot:name="field.component":data="formValue"/>,在父组件里面用<childComponent#slotName="childData"><childComponent/>。但是在子组件中应该如何进行插槽的......
ESP32的JTAG调试方法
ReportofJTAGIntroduction：Figuringoutabugthatiscausedbytwothreads,runningevensimultaneouslyontwodifferentCPUcores,cantakealongtimewhenallyouhaveareprintf()statements.Abetter(andinmanycasesquicker)waytodebugsuch......
系统化学习前端之Vue（vue2 组件通信）
前言前文vue2基础中聊过，页面本质是DOM树，而在vue2中组件=vm实例对象=DOM。因此，页面其实也是组件树构成，组件之间形成父子关系，兄弟关系等，相互之间通信也是组件树的必须要求。vue2组件通信组件通信即组件之间的数据传递。props和$emit$attrs和$listener$parent......
WPF入门教程系列二十七 ——DataGrid使用示例MVVM模式(4)
WPF入门教程系列目录WPF入门教程系列二——Application介绍WPF入门教程系列三——Application介绍(续)WPF入门教程系列四——Dispatcher介绍WPF入门教程系列五——Window介绍WPF入门教程系列十一——依赖属性（一）WPF入门教程系列十五——WPF中的数据绑定(一) ......
gitlab--不同的 stage 不重新下载代码、GIT_CHECKOUT、制品 artifacts
介绍在gitlabci中，不同的stage都会重新下载代码，例如下面的.gitlab-ci.ymldefault:image:ruby:2.7.5stages:#运行的阶段顺序-build-test-deploybuild:#job的名称stage:build#阶段的名称script:-ls-l-echo123>test1.txt#在......
gitlab--不同的 stage 不重新下载代码、GIT_CHECKOUT、制品 artifacts
介绍在gitlabci中，不同的stage都会重新下载代码，例如下面的.gitlab-ci.ymldefault:image:ruby:2.7.5stages:#运行的阶段顺序-build-test-deploybuild:#job的名称stage:build#阶段的名称script:-ls-l-echo123>test1.txt#在......
vue2响应式原理
一、初识响应式原理如果我们在Vue实例中声明过的数据发生了改变，那么所有用到这份数据的视图都会更新重新渲染，我们称这些数据就是响应式数据。响应式概括来说就是数据驱动视图的自动更新。<divid="app">{{obj.message}}</div>letdata={obj:{message:'Hel......
uniapp 组件中使用页面的生命周期（vue2）
用于直接在组件中使用onLoad，onBackPress等因为之前在写App的时候有许多弹窗，希望可以在有弹窗的时候先关闭弹窗，没有弹窗在执行返回事件，因此需要在页面onBackPress里面写很多判断，因此找了一些方法，写了可以直接在组件中调用页面生命周期的方法！使用mixinthis.$children去循环查询......

Vue2项目开发时遇到：<template v-for> key should be placed on the <template> tag

相关文章

赞助商

阅读排行