CSS calc() 函数

calc() 函数用于动态计算长度值。

需要注意的是，运算符前后都需要保留一个空格，例如：width: calc(100% - 10px)；

任何长度值都可以使用calc()函数进行计算；

calc()函数支持 "+", "-", "*", "/" 运算；

calc()函数使用标准的数学运算优先级规则；

解决搜索历史关键字前后顺序的问题和关键词重复的问题

          // 第一种方法
          // 1. 将 Array 数组转化为 Set 对象
          const set = new Set(this.historyList)
          // 2. 调用 Set 对象的 delete 方法，移除对应的元素
          set.delete(this.kw)
          // 3. 调用 Set 对象的 add 方法，向 Set 中添加元素
          set.add(this.kw)
          // 4. 将 Set 对象转化为 Array 数组
          this.historyList = Array.from(set)

          //需要数组的反转,添加计算属性
          historys() {
          // 注意：由于数组是引用类型，所以不要直接基于原数组调用 reverse 方法，以免修改  原数组中元素的顺序
          // 而是应该新建一个内存无关的数组，再进行 reverse 反转
          return [...this.historyList].reverse()
          }
          
          // 第二种方法
          const index=this.historyList.indexOf(this.kw)
          //第三种方法
          // const index=this.historyList.findIndex(item=>item===this.kw)
          //以下代码一样
          if(index>-1){
            this.historyList.splice(index,1)
          }
          // 从头部添加
          this.historyList.unshift(this.kw)