首页 新闻 会员 周边 捐助

vue,辨别两个对象里面相同属性的不同值,提取出来,给html页面添加高亮(商品对比)?

0
[待解决问题]

第一步 数组
msg: [

    {label: '好吃的汉堡11',jieshao: '150',img:'http://element-cn.eleme.io/2.0/static/hamburger.50e4091.png'},
    {label: '好吃的汉堡',jieshao: '150',img:'http://element-cn.eleme.io/2.0/static/hamburger.50e4091.png'}
  ]

第二步 渲染页面
<tr>

<th>名字</th><td:class="[item.label ? propName : 'mui-active', 'a']"

v-for="(item, $index) in Aabc":key="item.label">
{{item.label}}</td>

</tr> 
第三步 dui () {

  this.Aabc这个其实就是第一步的数组,是我通过props传过来的

   var aProps = Object.keys(this.Aabc[0])
   var bProps = Object.keys(this.Aabc[1])
    for (var a = 0; a < aProps.length; a++) {
        this.propName = aProps[a]
        if (this.Aabc[0][this.propName] !== this.Aabc[1][this.propName]) {
           console.log(this.propName, 'propName')
          // label  键的名字
    }
  }

}


第一个是我要遍历的数组,第二个是渲染对象里面的子项,因为我想做的是匹配这两个对象的哪些字段的值不同,
然后找出当前字段中的html给它添加class做一个高亮,第三部已经出来了this.propName名字是label,正好和第一个数组中的label值不一样说明这个判断正确,然后我的想法是能不能从html的使用v-for找到当前键的名字,然后通过第二歩和第三歩的对比,来添加高亮(有可能字段的值全不一样,所有都得加高亮)
比如这个卖出的网址效果 https://www.xin.com/c/compare...

菜鸟wl的主页 菜鸟wl | 初学一级 | 园豆:16
提问于:2018-01-27 17:58
< >
分享
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册