问答

Vue:Duplicate keys detected This may cause an update error.

作者:admin 2021-05-15 我要评论

我明明设置了不同的key 为什么还是报这个错? a-auto-complete v-model="query" :allowClear="true" :backfill="true" placeholder="查询曲目/乐谱" optionLabel...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

我明明设置了不同的key 为什么还是报这个错?

<a-auto-complete
            v-model="query"
            :allowClear="true"
            :backfill="true"
            placeholder="查询曲目/乐谱"
            optionLabelProp="title"
            class="search-box"
            @search="handleSearch"
            @blur="autoComplete = []"
          >
            <a-input>
              <a-button
                slot="suffix"
                class="search-btn"
                type="primary"
                style="margin-right: -12px"
                @click="searchPage"
              >
                <a-icon type="search" />
              </a-button>
            </a-input>
            <template slot="dataSource">
              <a-select-option
                class="option-item"
                v-for="item in autoComplete"
                :value="item.name"
                :key="`${item.name}_${item.id}`" //这里key不同**
                @click="jumpItem(item.id)"
              >
                <span>{{ item.name }}</span>
              </a-select-option>
            </template>
          </a-auto-complete>

把value设置为${item.name}_${item.id}以后不报错了
但是query的值就会变成${item.name}_${item.id}
不是name
我设置了a-select-option一个新属性:name="${item.name}_${item.id}"
以及optionLabelProp="name"
也不能正常回显name

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • 请问下prometheus怎么进行自定义的按业

    请问下prometheus怎么进行自定义的按业

  • 节流函数为什么,点击无效,监听窗口大

    节流函数为什么,点击无效,监听窗口大

  • express访问静态资源失败

    express访问静态资源失败

  • IE 浏览器下 match 方法报错

    IE 浏览器下 match 方法报错

腾讯云代理商
海外云服务器