被动模板if语句不考虑父if语句

Question

在我的模板中，我有一个字符串的if语句，该字符串有时是未定义的，因为它在循环内，循环中的项被删除并添加到其他事件发生时

下面是一个示例模板，它将是循环中的部分。当将myString从JS中的值更改为undefined时，该部分会导致activejs中的未定义错误。

{{#if myString}}
    {{#if myString.indexOf('hello people') > -1}}
        <p>Hello all the people</p>
    {{/if}}
    Why are the people?
{{/if}}

要停止错误，我必须这样做:

{{#if myString}}
    {{#if myString && myString.indexOf('hello people') > -1}}
        <p>Hello all the people</p>
    {{/if}}
    Why are the people?
{{/if}}

在子if语句中带有&&的模板对我来说没有多大意义，因为它应该考虑父if语句而不会导致错误。

是react翻译if语句的方式有问题，还是这对模板语言来说是正常的?

Answer 1

当前版本的react '扁平化'依赖于你的数据的事物的图表;这样做的一个副作用是，表达式有时会在被删除之前立即更新，这就导致了像下面这种不希望出现的情况。这可能在下一个版本(0.8)中改变。目前，最好的解决方法可能是您已经在使用的方法，不过如果可以使模板更具可读性，您也可以将其封装为函数:

{{#if isHelloPeople(myString) }}
    <p>Hello all the people</p>
{{/if}}

var ractive = new Ractive({
  data: {
    myString: 'hello people',
    isHelloPeople: function ( str ) {
      return str && ~str.indexOf( 'hello people' );
    }
  },
  // ...
});