使用regular内置方式遍历一个对象，当该对象变化时，会导致dom全量更新

[fengzilong]

• 问题描述：

  {#list items as item}
     <Component prop="{ item }" />
  {/list}

  以上面的代码为例，items是一个对象，当items中的某一项变化时，会导致对应的Component组件全量更新，内部的状态丢失，可能会导致性能问题

• 是否可以复现该问题：

  https://jsfiddle.net/fengzilong/ozcjdujk/

• 复现步骤：

  • 点击第一个按钮，按钮中的文字会变成"已点击"，每次update，只会更新计数，已点击的状态一直保持
  • 点击第二个按钮，按钮中的文字会变成"已点击"，但在下一次update时，已点击状态丢失

• 期待的结果：

  使用内置的list遍历一个对象时表现和使用Object.keys一致

• 演示：

  

• 问题类型：

  • Question
  • Bug
  • Discussion
  • Feature request
  • Tip
  • Enhancement
  • Performance

[leeluolee]

https://codepen.io/anon/pen/pbYoaX 有个trick

创建一个什么都不做的组件dump . 用来get你的表达式

// 这个组件仅仅用来get Expression
var dump = new Regular();

....
再创建一个过滤器
  getExpression: function(item, expression){
          dump.data = item;
          return dump.$get(expression)
        }

注：这里创建的是过滤器， 但是你直接定义一个组件函数 使用 this.getExpression也是可以的

[leeluolee]

对了上例的expression 写死了， 但是你可以传个变量进去

[fengzilong]

学到了~

[fengzilong]

稍微找到了点规律

如果修改items下的直接子元素，Object.keys优于内置方式，只会局部更新
https://jsfiddle.net/fengzilong/ozcjdujk/
https://jsfiddle.net/fengzilong/ozcjdujk/8/

如果越过直接子元素，通过items.foo.counter修改的话，Object.keys和内置方式表现是一致的
https://jsfiddle.net/fengzilong/ozcjdujk/7/

[fengzilong]

https://jsfiddle.net/fengzilong/ozcjdujk/9/
数组也是一样的，好像regular一开始就是这么设计的，所以这个issue我先关了~