因为项目一开始没有集成jquery,所以很多的方法都是用原生来写的。今天到网上找了几个操作类名的方法,如下:
export const hasClass = (el, cls) => {
return el.className.match(new RegExp('(\s|^)' + cls + '(\s|$)'))
}
export const removeClass = function (el, cls) {
if (hasClass(el, cls)) {
var reg = new RegExp('(\s|^)' + cls + '(\s|$)')
el.className = el.className.replace(reg, ' ')
}
}
export const addClass = function (el, cls) {
if (!this.hasClass(el, cls)) el.className += " " + cls
}
export const toggleClass = (el,cls) => {
console.log(hasClass)
if(hasClass(el,cls)){
removeClass(el, cls)
}else{
addClass(el, cls)
}
}
但是在用的时候却一直会报错,如下:
Uncaught TypeError: Cannot read property 'hasClass' of undefined
at addClass (Route.js?7c64bfe…:27892)
at HTMLpElement.item.onclick (Route.js?7c64bfe…:139726)
我打断点调试了下,还是没能找到问题出现的原因。不知道各位大神有没有遇到过同样问题的?
toggleClass里调用addClass和removeClass倒是对的,怎么想起来调用hasClass时前面加this的?
要看你这个this.hasClass()中this指的对象是什么了。你可以看看这个this指的是不是全局对象