首页 > 解决方案 > 变量已在上层范围内声明

问题描述

我有一个负责发送消息的代码,但它有一个错误。

    <div id="block-messages">
      <ul class="block-messages">
        <li v-for="(message, index) in messages" :key="index" class="mess">
          <b>{{ message.time }}</b>
          <b :style="{ color: message.colornick }" style="margin-left: 8px;">{{ message.nick }}</b>:
          <span :style="{ color: message.colortext }">{{ message.msg }}</span>
        </li>
      </ul>
    </div>

错误:

warning  Variable 'message' is already declared in the upper scope

我应该怎么办?

标签: javascriptvue.jsfrontend

解决方案


根据您的评论message,数据有价值。

这就是发生错误的原因。

您可以通过重命名模板或数据中的一个变量来避免这种情况,message如下所示(我重命名了 中的值v-for):

<div id="block-messages">
  <ul class="block-messages">
    <li v-for="(item, index) in messages" :key="index" class="mess">
      <b>{{ item.time }}</b>
      <b :style="{ color: item.colornick }" style="margin-left: 8px;">{{ item.nick }}</b>:
      <span :style="{ color: item.colortext }">{{ item.msg }}</span>
    </li>
  </ul>
</div>

推荐阅读