Vue displays content based on variable values

problem description

vue displays content according to variable value, such as variable = a, displays "rice noodle grain and oil", variable = b, then shows vegetables. If using v-if is too tedious, do you have any good idea

the environmental background of the problems and what methods you have tried

related codes

/ / Please paste the code text below (do not replace the code with a picture)
< div class= "ite" Vlyfor = "(it,inde) of newchild": key= "inde" >

        <div v-if="it.name == "a""></div>
        <div v-if="it.name == "s""></div>

what result do you expect? What is the error message actually seen?

Apr.29,2022

<div v-text="showContent"></div>
data () {
    return {
        listArr: [
            { name: 'a', value: '' },
            { name: 's', value: '' }
        ],
        showContent: ''
    }
}

mounted () {
    let a = 'a'; //  
    this.listArr.forEach((item) => {
      if (item.name === a) {
        this.showContent= item.value
      } 
    })
}

<template>
  <div class="ite" v-for="(it,inde) of newchild" :key="inde">
    <div>{{obj[it.name]}}</div>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        obj: {
          a: '',
          b: ''
        }
      }
    }
  }
</script>
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b3c0e4-4ef49.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b3c0e4-4ef49.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?