diff --git a/examples/sites/demos/pc/app/input/method-addMemory-composition-api.vue b/examples/sites/demos/pc/app/input/method-addMemory-composition-api.vue index 566202bbe..7230940fc 100644 --- a/examples/sites/demos/pc/app/input/method-addMemory-composition-api.vue +++ b/examples/sites/demos/pc/app/input/method-addMemory-composition-api.vue @@ -5,6 +5,7 @@ v-model="input" name="textMemory" placeholder="Please input" + :memory-space="3" @change="addMemory" > diff --git a/examples/sites/demos/pc/app/input/method-addMemory.spec.ts b/examples/sites/demos/pc/app/input/method-addMemory.spec.ts index 4c52fe479..49d6154f0 100644 --- a/examples/sites/demos/pc/app/input/method-addMemory.spec.ts +++ b/examples/sites/demos/pc/app/input/method-addMemory.spec.ts @@ -17,4 +17,15 @@ test('[Input]method-addMemory', async ({ page }) => { await input.fill('') const box = await page.locator('.tiny-modal__body').getByText('1234') await expect(box).toBeVisible() + + // memory-space = 3 + await input.fill('2222') + await input.blur() + await input.fill('3333') + await input.blur() + await input.fill('4444') + await input.blur() + await input.fill('') + await input.click() + await expect(page.locator('.tiny-tall-storage .tiny-storage-item')).toHaveCount(3) }) diff --git a/examples/sites/demos/pc/app/input/method-addMemory.vue b/examples/sites/demos/pc/app/input/method-addMemory.vue index 351582bab..54dc15fa9 100644 --- a/examples/sites/demos/pc/app/input/method-addMemory.vue +++ b/examples/sites/demos/pc/app/input/method-addMemory.vue @@ -5,6 +5,7 @@ v-model="input" name="textMemory" placeholder="Please input" + :memory-space="3" @change="addMemory" > diff --git a/examples/sites/demos/pc/app/input/webdoc/input.js b/examples/sites/demos/pc/app/input/webdoc/input.js index 6cd976ea1..aaf6b3e6a 100644 --- a/examples/sites/demos/pc/app/input/webdoc/input.js +++ b/examples/sites/demos/pc/app/input/webdoc/input.js @@ -295,6 +295,16 @@ export default { }, 'demoId': 'native' }, + { + 'name': 'memory-space', + 'type': 'number', + 'defaultValue': '5', + 'desc': { + 'zh-CN': '设置 addMemory 方法中,最大能保存条目的数量', + 'en-US': 'Sets the maximum number of entries that can be saved in the addMemory method' + }, + 'demoId': 'method-addMemory' + }, { 'name': 'maxlength', 'type': 'number', diff --git a/packages/renderless/src/tall-storage/index.ts b/packages/renderless/src/tall-storage/index.ts index 6192e4e63..fd6480e69 100644 --- a/packages/renderless/src/tall-storage/index.ts +++ b/packages/renderless/src/tall-storage/index.ts @@ -63,8 +63,7 @@ export const keydown = } } -const sortDeduplication = (array) => { - const memorySpace = 5 // 一个name的记忆量 +const sortDeduplication = (array, memorySpace = 5) => { const length = array.length let newArray = [] let fillterObj = {} @@ -106,7 +105,7 @@ const isJSONobject = (string, type) => { } } -const setLocalStorageage = (name, value) => { +const setLocalStorageage = (name, value, memorySpace = 5) => { if (typeof value === 'string') { const oldValue = localStorage.getItem(name) const isArray = isJSONobject(oldValue, Array) @@ -116,7 +115,7 @@ const setLocalStorageage = (name, value) => { let oldArray = JSON.parse(localStorage.getItem(name)) oldArray.unshift(value) - oldArray = sortDeduplication(oldArray) + oldArray = sortDeduplication(oldArray, memorySpace) newValue = JSON.stringify(oldArray) } else if (oldValue === null || oldValue === value) { newValue = value @@ -130,7 +129,7 @@ const setLocalStorageage = (name, value) => { export const addMemory = (props) => (value) => { if (props.name && value) { - setLocalStorageage(props.name, value) + setLocalStorageage(props.name, value, props.memorySpace) } } diff --git a/packages/theme/src/tall-storage/index.less b/packages/theme/src/tall-storage/index.less index f43b07b35..e811cab01 100644 --- a/packages/theme/src/tall-storage/index.less +++ b/packages/theme/src/tall-storage/index.less @@ -22,7 +22,6 @@ .component-css-vars-tall-storage(); position: relative; - margin-top: 2px; .@{storage-list-style-prefix-cls} { position: absolute; @@ -36,6 +35,8 @@ .@{storage-list-prefix-cls} { padding: 0; list-style: none; + overflow-y: auto; + max-height: calc(var(--ti-tall-storage-item-height) * 5); .@{storage-item-prefix-cls} { height: var(--ti-tall-storage-item-height); diff --git a/packages/vue/src/input/src/index.ts b/packages/vue/src/input/src/index.ts index b66fa3485..9562d7c3e 100644 --- a/packages/vue/src/input/src/index.ts +++ b/packages/vue/src/input/src/index.ts @@ -60,6 +60,10 @@ export const inputProps = { type: String, default: 'text' }, + memorySpace: { + type: Number, + default: 5 + }, vertical: { type: Boolean, default: false diff --git a/packages/vue/src/input/src/pc.vue b/packages/vue/src/input/src/pc.vue index f088b474c..8f38c86d9 100644 --- a/packages/vue/src/input/src/pc.vue +++ b/packages/vue/src/input/src/pc.vue @@ -247,6 +247,7 @@ export default defineComponent({ 'prefixIcon', 'autocomplete', 'showPassword', + 'memorySpace', 'validateEvent', 'showWordLimit', 'displayOnly',