一件小事引发的思考

今天遇到的小坑

<draggable v-model="categorylist" @start="drag=true" @end="drag=false" v-bind="dragOptions" style="display: flex;flex-wrap: wrap;justify-content: center;align-items: flex-start;">
  <mu-col span="12" sm="6" lg="4" v-for="(category,category_index) in categorylist" :key="JSON.stringify(category)" style="display: inline-flex" :class="edit?'move-cursor':''">
    <div class="site-card gy-shadow-2">
      <div class="title" v-if="!edit">{{category.categoryname}}</div>
      <div style="margin-bottom: -28px;" v-else>
        <mu-text-field v-model="category.categoryname" placeholder="输入分区名" style="max-width: 50%;"></mu-text-field>
        <mu-button color="error" small @click="deleteCate(category_index)">删除分区</mu-button>
        <mu-button fab small color="red" @click="category.isAdd = !category.isAdd" style="width: 30px;height: 30px;bottom:-3px;margin-left:15px;">
          <mu-icon value="add"></mu-icon>
        </mu-button>
      </div>
      <div class="gy-divider"></div>
      <div class="gy-list">
        <draggable v-model="category.sitelist" v-bind="dragOptions" @start="drag=true" @end="drag=false">
          <li v-for="(sitelist,index) in category.sitelist" :key="JSON.stringify(sitelist)" class="site-noicon gy-hoverable" :class="edit?'move-cursor':''">
            <div class="delete-button" v-show="edit" @click="deleteItem(category_index,index)">
              <mu-icon value="clear" color="#ffffff" size="10"></mu-icon>
            </div>
            <a v-bind:href="sitelist.url" target="_blank">{{sitelist.site_name}}</a>
          </li>
        </draggable>
      </div>
      <mu-expand-transition>
        <div class="add-form" v-if="category.isAdd&&edit">
          <mu-text-field v-model="inputSitename" placeholder="输入网站名" style="width:60%;"></mu-text-field>
          <mu-text-field v-model="inputUrl" placeholder="输入网址" style="width:60%;"></mu-text-field>
          <mu-button round color="success" @click="addItem(category_index)" :disabled="(inputSitename == '')||(inputUrl == '')">添加</mu-button>
        </div>
      </mu-expand-transition>
    </div>
  </mu-col>

</draggable>

第二行代码中使用

JSON.stringify(category)

作为key咋一看没有什么问题，但是