一、[ ] 和 . 的区别

1、 . 是要对象存在该属性才可赋值取出
2、 [ ] 即使对象不存在该属性也可以赋值和取出

二、v-for循环

通过 v-for=“index of number” ，number为自定义的一个数字

三、.后面不能让字符串与index进行拼接，而[ ] 里面是可以让字符串与index进行拼接。即 对象[“字符串”+index]

四、代码实现

<div class="battery" style="margin-top: 10px; margin-left: 30px">
        <div class="battry-container" v-for="index of 64" :key="index">
          <div class="battery-div">
            <span class="span-left">第 {{ index }} 组 状态：</span>
            <span
              class="span-radius"
              :style="{
                'background-color':
                  realTimeObj['sinwarn' + index] == 0 ? 'green' : 'red',
              }"
            ></span>
          </div>
          <div class="battery-div">
            <span class="span-left">
              <img class="battery-img" src="@/assets/image/battery.png" />
            </span>
            <span class="span-right">
              {{ realTimeObj["sinvol" + index] }} (V)</span
            >
          </div>
          <div class="battery-div">
            <span class="span-left">
              <img class="battery-img" src="@/assets/image/resistance.png" />
            </span>
            <span class="span-right">
              {{ realTimeObj["sintemp" + index] }} (℃)</span
            >
          </div>
          <div class="battery-div">
            <span class="span-left">
              <img class="battery-img" src="@/assets/image/temp.png" />
            </span>
            <span class="span-right">
              {{ realTimeObj["sinres" + index] }} (mΩ)</span
            >
          </div>
        </div>
      </div>

注意：realTimeObj是一个对象，有sinvol1、sinvol2+…+sinvol64个对象。
因此可以用 [ ] 进行取值, {{ realTimeObj[“sinres” + index] }}