vue中提示$index is not defined错误的解决方式

作者:愚蠢地人类 时间:2024-04-27 16:16:51 

今天学习Vue中遇到了一个报错信息:$index is not defined,是我写了个for循环在HTML中,然后是因为版本的问题

下面是解决方法:

原来的是 v-for="person in items"

v-on:click="deletePerson($index)"//这个仅仅适用于1.0版本,不要采坑了同学们

这个在Vue1.0版本中式适用的可以直接使用$index,但是在2.0是不适合的

在Vue 2.0版本中获取索引我们需要通过 v-for = "(person ,index) in items ", 点击事件我们也不能使用$index,应该使用

v-on:click="deletePerson(index)"

补充知识:vue中滚动页面,改变样式&&导航栏滚动时,样式透明度修改

.vue

<div class="commonHeader" v-bind:class="{ 'navActive': scrollFlag }">

<img src="@/images/home/icon_jdjr.png" v-bind:class="{ 'scrollFlag': scrollFlag }">

data

scrollFlag:false,

mounted

window.addEventListener('scroll', this.handleScroll)

methods


handleScroll () {
let _this=this;
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
// console.log(scrollTop)
if(scrollTop){
 _this.scrollFlag=true
}else{
 _this.scrollFlag=false
}
}

来源:https://blog.csdn.net/shaleilei/article/details/79145593

标签:vue,提示,$index,defined
0
投稿

猜你喜欢

  • Centos7 mysql数据库安装及配置实现教程

    2024-01-16 06:39:40
  • Python机器学习之基础概述

    2021-07-18 19:07:59
  • Python自定义scrapy中间模块避免重复采集的方法

    2022-02-19 13:32:44
  • django 使用 request 获取浏览器发送的参数示例代码

    2023-07-26 15:04:44
  • 《Python之禅》中对于Python编程过程中的一些建议

    2022-01-30 12:04:16
  • css去掉checkbox边框的方法

    2011-06-06 10:32:00
  • vue实现登录拦截

    2024-04-30 10:25:20
  • vue实现联动选择

    2024-05-22 10:42:28
  • 使用pandas批量处理矢量化字符串的实例讲解

    2023-09-22 03:00:01
  • vue中provide和inject的用法及说明(vue组件爷孙传值)

    2024-05-21 10:15:26
  • JS+CSS实现的日本门户网站经典选项卡导航效果

    2023-09-04 03:40:24
  • python 下载文件的多种方法汇总

    2023-08-11 16:50:05
  • pytorch中Schedule与warmup_steps的用法说明

    2023-07-07 00:18:14
  • 理解Python中的With语句

    2023-02-09 17:22:33
  • Python多个装饰器的调用顺序实例解析

    2021-09-30 06:54:56
  • localResizeIMG先压缩后使用ajax无刷新上传(移动端)

    2024-05-09 10:35:26
  • python实现简单的学生管理系统

    2022-11-25 08:34:04
  • 在Python中操作时间之mktime()方法的使用教程

    2023-02-07 11:38:58
  • 学点简单的Django之第一个Django程序的实现

    2021-03-23 05:10:59
  • 简单谈谈axios中的get,post方法

    2023-10-05 08:47:53
  • asp之家 网络编程 m.aspxhome.com