| | |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { ref } from 'vue'; |
| | | import { computed, ref, onMounted, watch, watchEffect } from 'vue'; |
| | | const props = defineProps({ |
| | | limit: { |
| | | type: Number, |
| | | default: 1, |
| | | }, |
| | | action: String, // 上传的服务器地址 |
| | | url: String, //回显的文件地址 |
| | | }); |
| | | |
| | | const emit = defineEmits(['update:fileList', 'success']); |
| | | const urls = computed(() => props.url); |
| | | const fileList = ref([]); |
| | | |
| | | watch( |
| | | () => props.url, |
| | | (newVal) => { |
| | | if (newVal) { |
| | | fileList.value = newVal.split(',').map((item) => ({ |
| | | uid: item, |
| | | name: item, |
| | | status: 'done', |
| | | url: item, |
| | | })); |
| | | } |
| | | }, |
| | | { |
| | | deep: true, // 开启深度监听 |
| | | } |
| | | ); |
| | | |
| | | onMounted(() => { |
| | | if (urls.value) { |
| | | fileList.value = urls.value.split(',').map((item) => ({ |
| | | uid: item, |
| | | name: item, |
| | | status: 'done', |
| | | url: item, |
| | | })); |
| | | } |
| | | }); |
| | | |
| | | // console.log(urls.value, 8988); |
| | | |
| | | const handleChange = (fileList) => { |
| | | emit('update:fileList', fileList); |
| | | const successFiles = fileList.filter((item) => item.status === 'done'); |