Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 | 7x 7x 7x | <script> import MEmitter from '../m-emitter.vue'; import cloneDeep from 'lodash/cloneDeep'; export default { name: 'm-dynamic', mixins: [MEmitter], props: { data: Array, dynamic: { type: Boolean, default: true }, getDefaultItem: Function, initialAdd: { type: Boolean, default: true }, minCount: { type: Number, default: 1 }, maxCount: { type: Number, default: Infinity }, }, data() { return { currentData: this.data, keysArray: [] }; }, watch: { data(data) { this.currentData = data; }, }, created() { const needCount = this.minCount - this.currentData.length; if (this.initialAdd && needCount > 0) { for (let i = 0; i < needCount; i++) this.add(); } // 设置行的key。行的key设置为rowIndex,会导致里面的validator错误信息错位 // 这里设置每行的唯一key this.currentData.forEach((item, index) => { this.setKey(item, index); }); }, methods: { add() { if (this.currentData.length >= this.maxCount) return; const item = this.getDefaultItem ? this.getDefaultItem() : {}; const index = this.currentData.length; if (this.$emitPrevent('before-add', { item, index, data: this.currentData }, this)) return; this.setKey(item, this.currentData.length + 1); this.currentData.push(item); this.$emit('add', { item, index, data: this.currentData }, this); this.$emit('splice', { item, index, data: this.currentData }, this); }, duplicate(index) { if (this.currentData.length >= this.maxCount) return; const item = cloneDeep(this.currentData[index]); if (this.$emitPrevent('before-duplicate', { item, index, data: this.currentData }, this)) return; this.setKey(item, this.currentData.length + 1); this.currentData.splice(index, 0, item); this.$emit('duplicate', { item, index, data: this.currentData }, this); this.$emit('splice', { item, index, data: this.currentData }, this); }, remove(index) { if (this.currentData.length <= this.minCount) return; const item = this.currentData[index]; if (this.$emitPrevent('before-remove', { item, index, data: this.currentData }, this)) return; this.currentData.splice(index, 1); this.$emit('remove', { item, index, data: this.currentData }, this); this.$emit('splice', { item, index, data: this.currentData }, this); }, setKey(item, index) { const key = `${(new Date()).getTime()}_${index}`; this.keysArray.push({ item, key }); }, getKey(item) { const keyItem = this.keysArray.find((keyItem) => keyItem.item === item); return keyItem && keyItem.key; }, }, }; </script> |