Solution of $index is not defined Error Prompt in vue
- 2021-08-10 06:34:09
- OfStack
Today, I encountered an error message in learning Vue: $index is not defined, I wrote an for loop in HTML, and then because of the version problem
Here are the solutions:
The original is v-for= "person in items"
v-on: click= "deletePerson ($index)"//This is only applicable to version 1.0, so don't pinch the students
This is applicable in Vue version 1.0 and can be used directly with $index, but it is not suitable in 2.0
In Vue version 2.0, we need to get the index through v-for = "(person, index) in items", and we can't use $index for click events, we should use
v-on:click="deletePerson(index)"
Additional knowledge: Scroll pages and change styles in vue & & When the navigation bar scrolls, the style transparency is modified
.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
}
}