[Vuejs]-How to set maxlength for li tag to 5 in vuejs?

0๐Ÿ‘

โœ…

If you want to show the most recent 5 entries, sorted from most recent to least recent, you can try

v-for="(item, index) in searchHistory.slice(-5).reverse()"

Edited by @taneeru dhanunjay

@keydown.space="preventLeadingSpace"
 preventLeadingSpace(e) {
      // only prevent the keypress if the value is blank
      if (!e.target.value) e.preventDefault();
      // otherwise, if the leading character is a space, remove all leading white-space
      else if (e.target.value[0]==' ') e.target.value = e.target.value.replace(/^\s*/, "");
    },

0๐Ÿ‘

Method 1:

v-for="(item, index) in searchHistory.slice(searchHistory.length-5)

selectPreviousSearch(index) {
    index += searchHistory.length-5;
    index = index<0?0:index;
    this.search = this.searchHistory[index];
    this.showSearchHistory = false;
 },

Method 2:
change the function to keep last 5 input where you stored searchHistory.

onChange(newInput){
    searchHistory.length >=5 && searchHistory.shift();
    searchHistory.push(newInput);
}

Leave a comment