优化自定义控件,避免报警告(不影响功能)

pull/216/head
zhangdaiscott 2022-11-01 19:33:22 +08:00
parent 737312e959
commit 088f72db62
3 changed files with 43 additions and 24 deletions

View File

@ -1,24 +1,26 @@
<template> <template>
<div class="area-select"> <a-form-item-rest>
<!--省份--> <div class="area-select">
<a-select v-model:value="province" @change="proChange" allowClear :disabled="disabled"> <!--省份-->
<template v-for="item in provinceOptions" :key="`${item.value}`"> <a-select v-model:value="province" @change="proChange" allowClear :disabled="disabled">
<a-select-option :value="item.value">{{ item.label }}</a-select-option> <template v-for="item in provinceOptions" :key="`${item.value}`">
</template> <a-select-option :value="item.value">{{ item.label }}</a-select-option>
</a-select> </template>
<!--城市--> </a-select>
<a-select v-if="level >= 2" v-model:value="city" @change="cityChange" :disabled="disabled"> <!--城市-->
<template v-for="item in cityOptions" :key="`${item.value}`"> <a-select v-if="level >= 2" v-model:value="city" @change="cityChange" :disabled="disabled">
<a-select-option :value="item.value">{{ item.label }}</a-select-option> <template v-for="item in cityOptions" :key="`${item.value}`">
</template> <a-select-option :value="item.value">{{ item.label }}</a-select-option>
</a-select> </template>
<!--地区--> </a-select>
<a-select v-if="level >= 3" v-model:value="area" @change="areaChange" :disabled="disabled"> <!--地区-->
<template v-for="item in areaOptions" :key="`${item.value}`"> <a-select v-if="level >= 3" v-model:value="area" @change="areaChange" :disabled="disabled">
<a-select-option :value="item.value">{{ item.label }}</a-select-option> <template v-for="item in areaOptions" :key="`${item.value}`">
</template> <a-select-option :value="item.value">{{ item.label }}</a-select-option>
</a-select> </template>
</div> </a-select>
</div>
</a-form-item-rest>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, PropType, ref, reactive, watchEffect, computed, unref, watch, onMounted, onUnmounted, toRefs } from 'vue'; import { defineComponent, PropType, ref, reactive, watchEffect, computed, unref, watch, onMounted, onUnmounted, toRefs } from 'vue';
@ -35,8 +37,17 @@
area: [String], area: [String],
level: propTypes.number.def(3), level: propTypes.number.def(3),
disabled: propTypes.bool.def(false), disabled: propTypes.bool.def(false),
codeField: propTypes.string,
size: propTypes.string,
placeholder: propTypes.string,
formValues: propTypes.any,
allowClear: propTypes.bool.def(false),
getPopupContainer: {
type: Function,
default: (node) => node.parentNode,
},
}, },
emits: ['change', 'update:value'], emits: ['change', 'update:value','update:area','update:city','update:province'],
setup(props, { emit, refs }) { setup(props, { emit, refs }) {
const emitData = ref<any[]>([]); const emitData = ref<any[]>([]);
// //

View File

@ -76,7 +76,8 @@
console.info(props); console.info(props);
const emitData = ref<any[]>([]); const emitData = ref<any[]>([]);
const treeData = ref<any[]>([]); const treeData = ref<any[]>([]);
const treeValue = ref(''); const treeValue = ref();
treeValue.value = '';
const attrs = useAttrs(); const attrs = useAttrs();
const [state] = useRuleFormItem(props, 'value', 'change', emitData); const [state] = useRuleFormItem(props, 'value', 'change', emitData);
watch( watch(
@ -118,7 +119,11 @@
function loadItemByCode() { function loadItemByCode() {
if (!props.value || props.value == '0') { if (!props.value || props.value == '0') {
treeValue.value = []; if(props.multiple){
treeValue.value = [];
}else{
treeValue.value = '';
}
} else { } else {
loadDictItem({ ids: props.value }).then((res) => { loadDictItem({ ids: props.value }).then((res) => {
let values = props.value.split(','); let values = props.value.split(',');
@ -127,6 +132,9 @@
value: values[index], value: values[index],
label: item, label: item,
})); }));
if(!props.multiple){
treeValue.value = treeValue.value[0];
}
onLoadTriggleChange(res[0]); onLoadTriggleChange(res[0]);
}); });
} }

View File

@ -6,8 +6,8 @@
:action="uploadUrl" :action="uploadUrl"
:fileList="fileList" :fileList="fileList"
:disabled="disabled" :disabled="disabled"
:remove="onRemove"
v-bind="bindProps" v-bind="bindProps"
@remove="onRemove"
@change="onFileChange" @change="onFileChange"
@preview="onFilePreview" @preview="onFilePreview"
> >