Vue3 guru needed!

[beneva52]

Hello, I was playing around with the component InverterTotalInfo.vue to experiment Vue3, but I'm facing a problem...
The component works, but in Visual Studio Code, I have this error on totalData[liveData]:

Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'Total'.
No index signature with a parameter of type 'string' was found on type 'Total'.ts(7053)

Could someone help me resolve this issue?
Thanks in advance,
Ben

<template>
    <div class="row row-cols-2 row-cols-md-3 g-5">
        <div class="col" v-for="liveData in ['Power','Voltage','Current','YieldDay','YieldTotal']">
            <div class="card">
                <div class="card-header text-bg-success">{{ $t('invertertotalinfo.Total'+liveData) }}</div>
                <div class="card-body card-text text-center">
                    <h2>
                        {{ $n(totalData[liveData].v, 'decimal', {
                            minimumFractionDigits: totalData[liveData].d,
                            maximumFractionDigits: totalData[liveData].d
                        })}}
                        <small class="text-muted">{{ totalData[liveData].u }}</small>
                    </h2>
                </div>
            </div>
        </div>
    </div>
</template>

<script lang="ts">
import type { Total } from '@/types/LiveDataStatus';
import { defineComponent, type PropType } from 'vue';

export default defineComponent({
    props: {
        totalData: { type: Object as PropType<Total>, required: true },
    },
});
</script>

[beneva52]

I reply to myself :)
Replace totalData[liveData] with (totalData as any)[liveData]
Not sure if it's the right way but it works.