vue控制台报错的问题
来源：2-7 使用v-for, v-html 指令精简页面代码
果子呀
2022-03-28 09:18:37
<template>
<!-- 附近店铺 -->
<div class="nearby">
<h3 class="nearby_title">附近店铺</h3>
<div class="nearby_item" >
<img
class="nearby_item_img"
:src="item.imgUrl"
/>
<div class="nearby_content" v-for="item in nearbyList" :key="item.id">
<div class="nearby_content_title">{{item.title}}</div>
<div class="nearby_content_texts">
<span class="nearby_content_text"
v-for="(innerItem , innerIndex) in item.tags"
:key="innerIndex"
>
{{innerItem}}
</span>
<p class="nearby_content_highlight">
{{item.desc}}
</p>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'Nearby',
setup () {
const nearbyList = [
{
id:1,
imgUrl:'https://www.dell-lee.com/imgs/vue3/near.png',
title:'沃尔玛',
tags:['月售1万+','0元起送','5元基础起送费'],
dese:'VIP尊享满89元减4元优惠'
},
{
id:2,
imgUrl:'https://www.dell-lee.com/imgs/vue3/near.png',
title:'沃尔玛',
tags:['月售1万+','0元起送','5元基础起送费'],
desc:'VIP尊享满89元减4元优惠'
}
]
return {nearbyList}
}
}
</script>
<style lang="scss">
//nearby
.nearby {
&_title {
margin: 0.16rem 0 0.04rem 0;
font-size: 0.18rem;
color: #333;
font-weight: normal;
}
&_item {
display: flex;
padding-top: 0.12rem;
&_img {
margin-right: 0.16rem;
width: 0.56rem;
height: 0.56rem;
}
}
&_content {
flex: 1;
padding-bottom: 0.12rem;
border-bottom: 1px solid #f1f1f1;
&_title {
font-size: 0.16rem;
line-height: 0.22rem;
color: #333;
}
&_texts {
line-height: 0.18rem;
font-size: 0.13rem;
color: #333;
margin-top: 0.08rem;
}
&_text {
margin-right: 0.16rem;
}
&_highlight {
margin: 0.18rem 0 0 0;
line-height: 0.18rem;
font-size: 0.13rem;
color: #e93b3b;
}
}
}
</style>
相关截图：
问题描述：
老师这是哪里错了啊，我反复看了好多遍，没有发现哪里有错，控制台抛出了好多错误
1回答
-
好帮手慕慕子
2022-03-28
同学你好，截图中的报错，是ESLint语法检测导致的，例如：
由于ESLint插件会干扰我们开发，建议当前阶段把它禁掉， 具体参考如下方式：
打开package.json文件，看有没有如下红线处的代码：
有的话，将其删除，再重启（逗号也要删除）。
如果没有的话，可以看看项目中有没有.eslintrc.js文件，如果有的话，把下方代码删掉，删掉之后重新启动项目：
祝学习愉快！
0
相似问题