vue 中 loading 状态与值为空 filter

vue 中 loading 状态与值为空 filter

/**
 * 值为 loading 状态时，显示 ‘-’
 *
 * @param {*} value           - 值
 * @param {boolean} isLoading - 是否为 loading 状态
 * @param {string} [loadingText='-']
 * @returns
 */
export function valueLoadingFilter (value, isLoading, loadingText = '-') {
  return isLoading ? loadingText : value
}

/**
 * 数据为空时，显示 ‘--’
 *
 * @param {*} value
 * @param {string} [emptyText='--']
 * @returns
 */
export function emptyText (value, emptyText = '--') {
  return !value || (value.constructor === Array && !value.length) || (value.constructor === Object && !Object.keys(value).length) ? emptyText : value
}

const valueLoading = {
  install: function (Vue) {
    Vue.prototype.$valueLoading = valueLoadingFilter
    Vue.filter('valueLoading', valueLoadingFilter)

    Vue.prototype.$emptyText = emptyText
    Vue.filter('emptyText', emptyText)
  }
}
export default valueLoading

// useAge:
// {{ message | valueLoading(isLoading) }}