How does vue listen for a change in an array of data and highlight it?

<template>
  <div>
    <ul>
      <li v-for="data in datas" :key="data.id">{{data}}</li>
    </ul>
  </div>
</template>

export default {
  data() {
    return {
      datas: []
    };
  }
};

this datas returns new data every 5 seconds through setInterval, and some of the data in it may change. How to make some changed data (a li) flash to prompt the user?

Vue.js
Mar.28,2021

according to the description of the landlord
We only need to listen for changes in stock values
here value is used instead of
you can save the data obtained last time 

{
    oldDatas:[]
}

then the new list compares the value of the value with the old list, which can be highlighted by adding the class name to the li 

<li v-for="(data,index) in datas" :key="data.id" :class="{isChanged: oldDatas[index].value !=== data.value}">{{data}}</li>

Previous: How to change the color of css3 text

Next: Ajax post requests an object of xml, which cannot be sent to the backend to report an error.

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu