tass-ui
Version:
A high quality UI Toolkit built on Vue.js3+.
53 lines (52 loc) • 1.35 kB
JavaScript
import { getCurrentInstance, inject, computed } from "vue";
import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from "../../../constants/event.mjs";
function useModel(props) {
const { emit } = getCurrentInstance();
const useProvide = inject("TassCheckboxGroup", {});
const model = computed({
get() {
return useProvide.modelValue ? useProvide.modelValue.value : props.modelValue;
},
set(val) {
var _a;
if (useProvide.modelValue) {
return (_a = useProvide.handlerChange) == null ? void 0 : _a.call(useProvide, val);
}
emit(UPDATE_MODEL_EVENT, val);
}
});
return model;
}
function useCheckbox(props, model) {
const isChecked = computed(() => {
const value = model.value;
if (Array.isArray(value)) {
return value.includes(props.label);
} else {
return value;
}
});
return isChecked;
}
function useEvent() {
const { emit } = getCurrentInstance();
function handlerChange(e) {
const target = e.target;
const val = target.checked ? true : false;
emit(CHANGE_EVENT, val);
}
return handlerChange;
}
const useCheckBoxProps = (props) => {
const model = useModel(props);
const isChecked = useCheckbox(props, model);
const handlerChange = useEvent();
return {
model,
isChecked,
handlerChange
};
};
export {
useCheckBoxProps
};