koakumaping / ct-hodor

ct-hodor

ct-hodor

已离职 停止更新 三年不断更新迭代的成果，继续努力吧。

install

npm install ct-hodor

usage

import ctHodor from 'ct-hodor'
import 'ct-hodor/dist/ctHodor.css'
Vue.use(ctHodor)

// 配置notice组件
const notice = new Vue.prototype.$notices(store)
window.notice = notice

config vue template

<template>
  <div id="root">
    <router-view></router-view>
    <ctNotification></ctNotification>
  </div>
</template>

notice usage

vuex

const notice = {
  state: {
    list: [],
    timer: '',
  },
  mutations: {
    ADD_NOTICE: (state, payload) => {
      state.list.push(payload)
    },
    DEL_NOTICE: (state, key) => {
      const notices = state.list
      const l = notices.length
      for (let i = 0; i < l; ++i) {
        if (notices[i].key === key) {
          notices.splice(i, 1)
          break
        }
      }
    },
  },
}

export default notice

usage

window.notice.info({
  title: '提示信息',
  content: '内容',
})

window.notice.warn({
  title: '提示信息',
  content: '内容',
})

window.notice.success({
  title: '提示信息',
  content: '内容',
})

window.notice.error({
  title: '提示信息',
  content: '内容',
})