necesito generar los valores de la tabla usando Vue Js QuerySelector. Aquí está mi tabla Element-UI

 <el-table :key="tableKey" v-loading="listLoading" :row-class-name="tableRowClassName" :data="list" border fit highlight-current-row style="width: 100%;" @sort-change="sortChange" > <el-table-column label="Indicator" prop="id" align="center" width="100px" :class-name="getSortClass('id')"> <template slot-scope="{row}"> <span>{{ row.name }}</span> </template> </el-table-column> <el-table-column id="column_id" label="TX_NEW" width="100px" align="center"> <el-table-column label="Male" width="70px" align="center"> <template class="temp" slot-scope="{row}"> <span id="sp" align="center" text-align="center"> <el-input type="number" :id="row.id" :value="row.value" style="width:55px; font-size: x-small !important; text-align: center;" align="center" /> </span> </template> </el-table-column> </el-table-column>

Pero no puedo obtener resultados cuando intento debajo de javascript usando querySelector para el HTML anterior

 const divElement = document.querySelector('#column_id') if (divElement) { const divTableBody = divElement.querySelectorAll('el-table-column .temp') for (let i = 0; i < divTableBody.length; i++) { const output = divTableBody[i].querySelector('el-input').textContent.trim() console.log(output) } }

Amablemente, necesito ayuda para el problema. Gracias