在ul内使用v-for绑定数据,编辑器里显示有错误,但是浏览器里正常显示了并且没有报错

在ul内使用v-for绑定数据,编辑器里显示有错误,但是浏览器里正常显示了并且没有报错

如图,在li标签上使用v-for动态绑定,一直标红,但是页面里的内容都正常显示了并且没有报错http://img1.sycdn.imooc.com//climg/5ebfc2dc096094bd07160424.jpg

http://img1.sycdn.imooc.com//climg/5ebfc3160944045e10930223.jpg

正在回答

登陆购买课程后可参与讨论,去登陆

4回答

同学你好,问题解答如下:

1、key值是这两个类型就可以,没有其他要求

2、不同的v-for遍历的内容不同,那么key属性值也是不同的。

祝学习愉快!

好帮手慕星星 2020-05-17 15:47:09

同学你好,问题解答如下:

1、图片中是有预期值类型的数值或者字符串

http://img1.sycdn.imooc.com//climg/5ec0eb470950d7b004260102.jpg

写item是可以的,因为每次的循环item值也不一样。

2、写<也是可以的,可能对于编辑器语法来说不太规范,但是项目运行没有问题。或者同学用&lt;也可以。

祝学习愉快!

  • 提问者 Aurora_Meteor #1
    那key属性的值应该是数字或者字符串类型的,没有其他的要求是吧? 而且我是说不同的v-for后面的 key属性的值是不是应该不同,和‘每次的循环item值也不一样’没什么关系呢吧。
    2020-05-17 15:53:06
好帮手慕星星 2020-05-17 09:54:14

同学你好,当前课程中可能没有提到key值,但是后面实战中是有提到的,推荐还是添加上key值,否则可能会有警告。文档中介绍

https://cn.vuejs.org/v2/api/#key

http://img1.sycdn.imooc.com//climg/5ec098fb09b189ef08510426.jpg

另外,如果添加上key值是不会有问题的,页面会正常显示。建议重新检查下是不是哪里写的有问题,如果找不到可以将代码粘贴上来,老师帮助测试。或者不写key值也是可以的。

祝学习愉快!

  • 提问者 Aurora_Meteor #1
    哦哦我写成了v-for-key,那它的取值有什么要求吗?还是说随便写?可以写一样的吗?我都写成item也没报错,可是文档说是用来做标识的,是不是应该不一样?
    2020-05-17 11:36:44
  • 提问者 Aurora_Meteor #2
    另外,在detail页面的返回按钮,直接写‘<’不好吧,左尖括号不是应该都写成‘&lt;’吗?这里写‘<’编辑器都报错了的 <router-link to="/"> <div class="video-back"><</div> </router-link>
    2020-05-17 11:38:42
好帮手慕码 2020-05-16 18:58:26

同学你好,Vue 2.2.0+的版本里,当在组件中使用v-for时,建议添加key值。

解决方法:

在v-for 后添加 :key='item'

http://img1.sycdn.imooc.com//climg/5ebfc687092b2ace05260144.jpg

在编辑器中,对于这个写法是有“纠错”提示的,但是在浏览器中允许不添加key的写法。

如果我的回答帮到了你,欢迎采纳,祝学习愉快~

  • 提问者 Aurora_Meteor #1
    那写v-for的时候是都在后面加上key吗?还是不用管它?课程视频里好像也没提到这个东西呢。
    2020-05-16 19:04:22
  • 提问者 Aurora_Meteor #2
    我试了下加上key以后,v-for-key,编辑器里不报错了,虽然页面也没有报错但是相关的内容都不再显示了。所以就只写v-for,编辑器的错误不去管它?
    2020-05-16 21:01:47
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师