Extract HTML attribute data with Vuejs

Dear I am developing a component collapse (accordion), which will show me data. But I need to make the method where I show the data is executed at the beginning of the application:

mounted:function(){
     // invocar los métodos
     this.idRubro = this.$el.getAttribute('dataid');
      console.log('idrubros '+ this.idRubro);

    },

HTML:

  <tr v-for="name in pcuentas" :dataid="name['.key']" :id="div1" :key="name['.key']">

      <td >
         {{name.cuenta}} 

        <a href="javascript:void(0);"  @click="showSubRubro(name['.key'])">
        <i class="fas fa-angle-down"></i>
        </a>
           <ul class='beer-list'  >
            <li 
            v-for="item in beerList" 
            :key="item.id" 
            v-if="name['.key']===item.id">

                {{ item.nombre }}

            </li>
          </ul> 

          <a href="javascript:void(0);" 
          @click="emitIDRubro(name['.key'])"
          data-target="#ModalSubCuenta" 
          data-toggle="modal" 
          >
          <i class="fas fa-plus"></i>
           </a>
      </td>

    </tr>

data of the component:

props:['dataid'],
  data() {
    return {
      mensaje: "Agregar rubro a plan contable",
      plandcuenta:{
          nombrepcuenta:'',
      },
      idRubro:'',
      dataid:'',
      idrubros:null,
      beerList: [],
      id:'',
      subrubro:[{}],
      //cuentaShow:[],
      //dataRubros:[{}],
     // notesid:[]
    };
  },

Method that shows me the data:

   showSubRubro(id){

    var _this = this
    firebase.database().ref('subrubro/' + id).on('value', function(snapshot) {
      _this.beerList = snapshot.val()
      console.log(_this.beerList)
       console.log(_this.dataid)
    })

I need to place showSubRubro(id) within mounted but I am not able to capture the ID of the attribute dataid Can someone tell me what I'm doing wrong?