Prevent template rendering when computed property returns null

I have a template which renders a list from an array of objects (liveMatchesData) returned by a computed property. The template uses conditional rendering to check that a.) the array is not null and b.) the array length is > 0. The computed property returns the array by accessing a Vuex state which is an array and initialised as such.

 <div class="matches" v-if="liveMatchesData!= null&& liveMatchesData.length > 0">

My issue is that occasionally the computed property returns null which in turn clears the liveMatchesData list from the DOM, leaving a blank space. This stays like this until a few seconds later when the state updates (Axios calls to an API), the computed property is no longer null and so the template renders correctly once again.

Is there a way to keep the previously rendered list visible in the DOM when the computed property changes to null and prevent the update when the value is null?

I realise the problem here may be my state should not be returning null all but for the moment it is.

I haven’t found the answer to my question as I have asked it but I have resolved the problem - stopping state returning null.

Turns out axios was infrequently returning null in which, without being validated was being written to state and so being picked up in my computed property.