使用v-html只能解析成正确的html代码，不能展示效果
可以先转化为为正确的html再解析

以下代码$符号需改成&符号

function htmlDecode(html) {
 return html.replace(/$lt;|$gt;|$quot;|$amp;/g, match => {
  switch(match) {
  case '$lt;':
   return '<';
  case '$gt;':
   return '>';
  case '$quot;':
   return '"';
  case '$amp;':
   return '&';
 }
 })
}

在config目录下，改index.js
build 》assetsPublicPath: './',

直接上代码，nice
结构

<ul class="area-nav" ref="citynav">
     <li class="active">贵阳市</li>
     <li>遵义市</li>
     <li>六盘水市</li>
     <li>安顺市</li>
     <li>毕节市</li>
     <li>铜仁市</li>
     <li>黔东南市</li>
     <li>黔南市</li>
     <li>黔西南市</li>
</ul>

样式

  .area-nav{
    height: 53px;
    width: 100%;
    display: flex;
    flex-direction: row;
    /* flex-wrap: nowrap; */
    /* justify-content: space-between; */
    border-bottom: 1px solid #E9D9D6;;
    margin-bottom: 21px;
    overflow-x: auto;
    overflow-y: hidden;
    
    transition: margin-left 2s;
    -webkit-transition: margin-left 2s; /* Safari */
    
  }
  .area-nav::-webkit-scrollbar{
        height: 5px;
  }
  .area-nav li{
    font-size: 22px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    line-height: 50px;
    color: #333333;
    position: relative;
    display: inline-table;
    padding: 0 20px;
    flex-shrink: 0;
  }
  .area-nav li.active,.area-nav li:hover{
    font-size: 28px;
    font-family: Microsoft YaHei;
    font-weight: bold;
    color: #FA3230;
  }
  .area-nav li.active:after,.area-nav li:hover:after{
    content: '';
    position: absolute;
    bottom: 1px;
    left: 50%;
    transform: translate(-50%, 0);
    width: 40%;
    height: 6px;
    background: #FF5B36;
    border-radius: 3px;
  }

脚本

cityBanner:function(){
    let speed = 0;
    let pl = 0;//判断上一次值和本次值是否一样调换方向
    window.setInterval(function(){
        //这里scrollWidth 不是scrollLeft值
        if(speed == 2 && pl == thisApp.$refs.citynav.scrollLeft){
            speed = -1;
        }else if(thisApp.$refs.citynav.scrollLeft == 0){
            speed = 2;
        }
        pl = thisApp.$refs.citynav.scrollLeft;
        thisApp.$refs.citynav.scrollLeft += speed;        
    },50);
}

我相信，好多查这个问题的人都知道怎样删除数组数据。但在查找情况下，及查到一个值删除一个值，就不会了
vue删除值通常有3种
arr.aplice(索引值,删除长度);
delete arr[索引值];
this.$delete(arr,索引值);

那问题来了，查找呢？
开始我是这样写的，哈哈，发现有问题，删除某一项数据后，数组大小会变，按索引值不对后面就不对了

for(let s in data){
   if(data[s] == search){
        data.splice(s,1);
   }
}

这个问题纠结我了好久，突然想到，把数组倒过来查并删除数据项，就不会出现这样的情况了，突然想通过了，有点好气的感觉，原来，就这么简单。哈哈，你是不是也有这样的感觉？

for(let s=data.length-1;s>=0;s++){
   if(data[s] == search){
        data.splice(s,1);
   }
}

问题的出现：
当单选的模板也是数据配置时，出现数字的key 不能 正常渲染

如：
options 是这样的数据时，就想做三个选项，但这三个选项也是数据配置项，key为数字时不能正常渲染
options:{1:'二手市场', 2:'新闻页',3:'趣味中心'}

<el-radio
        v-for="(item,i) in options"
        v-model="formData[fd.prop]"
        :label="i"
        :key="i"
        :disabled="readonly">
    {{item}}
</el-radio>

出现情况分析
应该是数据类型不匹配
formData[*]打印出数据类型是number
那应该就是options在后续的处理中，已经把数据类型变了

解决办法
当判断 formData[*]为number时，强制性把 options 的key转化为number

<el-radio
        v-for="(item,i) in options"
        v-model="formData[fd.prop]"
        :label="(typeof formData[*] == 'number')?Number(i):i"
        :key="i"
        :disabled="readonly">
    {{item}}
</el-radio>