Change vuejs with blade variables if vuejs variables is empty

I'm using laravel blade with vue js in the same view. I test if vueObject exists i display it with vue js tag, if not i display bladeArray with blade template tag like below :

<p v-if="vueObject"> @ </p>
<p v-if="!vueObject">  </p>

<p v-if="vueObject"> @ </p>
<p v-if="!vueObject">  </p>

<p v-if="vueObject"> @ </p>
<p v-if="!vueObject">  </p>

<p v-if="vueObject"> @ </p>
<p v-if="!vueObject">  </p>

<p v-if="vueObject"> @ </p>
<p v-if="!vueObject">  </p>

<p v-if="vueObject"> @ </p>
<p v-if="!vueObject">  </p>

<p v-if="vueObject"> @ </p>
<p v-if="!vueObject">  </p>

<p v-if="vueObject"> @ </p>
<p v-if="!vueObject">  </p>

<p v-if="vueObject"> @ </p>
<p v-if="!vueObject">  </p>

<p v-if="vueObject"> @ </p>
<p v-if="!vueObject">  </p>

<p v-if="vueObject"> @ </p>
<p v-if="!vueObject">  </p>

<p v-if="vueObject"> @ </p>
<p v-if="!vueObject">  </p>

......

I have 30 vars (var1.....var31). So my issue is that it's too much to make conditions like the code above. Is there a better solution than that?

via Chebli Mohamed