zoukankan      html  css  js  c++  java
  • 不要在mutation回调函数之外,修改vuex仓库里属性的状态

    [vuex] do not mutate vuex store state outside mutation handlers.

    import * as types from './mutation-types'
    import {playMode} from 'common/js/config'
    import {shuffle} from 'common/js/util'
    
    
    export const insertSong = function({commit, state}, song) {
      let playlist = state.playlist.slice()  // 创建一个副本
      let sequenceList = state.sequenceList.slice() // 创建一个副本
      let currentIndex = state.currentIndex 
      // 记录当前歌曲
      let currentSong = playlist[currentIndex]
      // 查找当前列表中是否有待插入的歌曲并返回其索引
      let fpIndex = findIndex(playlist, song)
      // 因为是插入歌曲,所以索引+1
      currentIndex++
      // 插入这首歌到当前索引位置
      playlist.splice(currentIndex, 0, song)
      // 如果已经包含了这首歌
      if (fpIndex > -1) {
        // 如果当前插入的序号大于列表中的序号
        if (currentIndex > fpIndex) {
          playlist.splice(fpIndex, 1)
          currentIndex--
        } else {
          playlist.splice(fpIndex + 1, 1)
        }
      }
    
      let currentSIndex = findIndex(sequenceList, currentSong) + 1
    
      let fsIndex = findIndex(sequenceList, song)
    
      sequenceList.splice(currentSIndex, 0, song)
    
      if (fsIndex > -1) {
        if (currentSIndex > fsIndex) {
          sequenceList.splice(fsIndex, 1)
        } else {
          sequenceList.splice(fsIndex + 1, 1)
        }
      }
    
      commit(types.SET_PLAYLIST, playlist)
      commit(types.SET_SEQUENCE_LIST, sequenceList)
      commit(types.SET_CURRENT_INDEX, currentIndex)
      commit(types.SET_FULL_SCREEN, true)
      commit(types.SET_PLAYING_STATE, true)
    }
  • 相关阅读:
    元素居中显示
    文本框 获取焦点 失去焦点 实时监听
    cookie/ localStorage /sessionStorage区别
    h5新增标签
    css3属性中的transform属性
    精简 闭包
    let const定义及用法
    关于arguments映射的问题
    Linux云自动化运维第二课
    下载模版的具体代码
  • 原文地址:https://www.cnblogs.com/ladybug7/p/12348546.html
Copyright © 2011-2022 走看看