vuux/dist/es/MapInput/src/hook/useMapInput.mjs

Vue3 Nuxt3 Nuxt4 组件库

import { computed as o } from "vue";
import { Utils as s } from "@vuux/utils";
const k = (u, a, d) => {
  const l = o({
    get() {
      return u.modelValue && u.modelValue.length > 0 ? u.modelValue : [
        {
          id: s.snowflakeId().toString(),
          key: "",
          value: ""
        }
      ];
    },
    set(e) {
      d(
        "update:modelValue",
        e.map((t) => ({ ...t }))
      );
    }
  }), n = () => {
    d(
      "update:modelValue",
      l.value.map((e) => ({ ...e }))
    );
  };
  return {
    items: l,
    syncValue: n,
    addItem: () => {
      l.value.push({
        id: s.snowflakeId().toString(),
        key: "",
        value: ""
      }), a.value.push(null), n();
    },
    deleteItem: (e) => {
      l.value.length > 1 && (l.value.splice(e, 1), a.value.splice(e, 1), n());
    },
    canDelete: () => l.value.length > 1,
    canAdd: (e) => e === l.value.length - 1,
    getAll: () => l.value.filter((e) => e.id && e.key),
    getById: (e) => l.value.find((t) => t.id === e) || null,
    getByKey: (e) => l.value.find((t) => t.key === e) || null,
    getByIds: (e) => l.value.filter((t) => e.includes(t.id)),
    getByKeys: (e) => l.value.filter((t) => e.includes(t.key))
  };
};
export {
  k as useMapInput
};