VUE—仿照淘宝历史记录的添加和删除（图文）

VUE—仿照淘宝历史记录的添加和删除

第一步： html

<template>
  <div>
    <div class="list">
<!--      例如淘宝推荐的热门搜索-->
      <h3>列表</h3> 
      <ul>
        <li ref="list" @click="chooseFn(index)" v-for="(item, index) in datalist" :key="index">{
  {item.title}}</li>
      </ul>
    </div>
    <div class="history">
<!--      点击热门搜索关键字之后在历史记录里添加-->
      <h3>历史记录</h3>
      <button @click="deleteFn">删除</button>
      <ul>
        <li v-for="(item, index) in datahistory" :key="index">{
  {item}}</li>
      </ul>
    </div>
  </div>
</template>

第二步：热门搜索列表

let datalist = [
    {
      title: 'aaa