@fe6/water-pro/es/_util/hooks/use-form-item.js

An enterprise-class UI design language and Vue-based implementation

/** @format */
import { reactive, readonly, computed, getCurrentInstance, watchEffect, toRefs } from 'vue';
import { isEqual } from 'lodash-es';
export function useRuleFormItem(props) {
  var key = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'value';
  var changeEvent = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'change';
  var instance = getCurrentInstance();
  var emit = instance === null || instance === void 0 ? void 0 : instance.emit;
  var innerState = reactive({
    value: props[key]
  });
  var defaultState = readonly(innerState);

  var setState = function setState(val) {
    innerState.value = val;
  };

  watchEffect(function () {
    innerState.value = props[key];
  });
  var state = computed({
    get: function get() {
      return innerState.value;
    },
    set: function set(value) {
      if (isEqual(value, defaultState.value)) {
        return;
      }

      innerState.value = value;
      emit === null || emit === void 0 ? void 0 : emit(changeEvent, value);
    }
  });
  return [state, setState, defaultState, toRefs(innerState)];
}