动态添加类名

POOPE

给每个li添加test3类名：

<ul ref="ulRef">
    <li class="test1 test2">项目一</li>
    <li class="test1 test2">项目二</li>
    <li class="test1 test2">项目三</li>
  </ul>

1、utils/utils.js中声明addClass函数

export const addClass = (el, className) => {
  if (_hasClass(el, className)) return
  let newClass = el.className.split(' ')
  newClass.push(className)
  el.className = newClass.join(' ')
}
// 判断当前元素中是否有该类名
const _hasClass = (el, className) => {
  const reg = new RegExp('(^|\\s)' + className + '(\\s|$)')
  return reg.test(el.className)
}

2、引入并使用：

import { addClass } from '@utils/utils'

mounted() {
  this._addClass()
  },
  methods: {
  _addClass() {
    let list = this.$refs.ulRef.children
    list.forEach((item) => {
    addClass(item, 'test3')
    })
  }
  }

效果：