ExtJS 3.4.1 treegrid中Ext.XTemplate如何实现if else条件判断

ExtJS 3.4的TreeGrid组件列确实没有开放renderer配置项，但你当前已经在使用的Ext.XTemplate原生支持条件逻辑，不需要修改组件源码就能实现需求，两种常用写法如下：

• 简单场景直接用XTemplate内置条件标签
  针对你当前的单值判断需求，直接用<tpl if>语法写模板即可，不需要额外封装函数：

  {   
      dataIndex: 'SpReset',
      tpl: new Ext.XTemplate(
          '<tpl if="values.data.SpReset === 1">Yes</tpl>'
      )
  }
  

  逻辑和你预期完全一致：SpReset为1时输出Yes，其余所有情况默认输出空字符串，不需要额外写else分支。

• 复杂逻辑用XTemplate自定义成员方法
  如果后续判断逻辑变复杂（比如多状态映射、值格式化、拼接额外内容），可以在XTemplate上挂载自定义处理函数，写法和普通Grid的renderer几乎一致：

  {   
      dataIndex: 'SpReset',
      tpl: new Ext.XTemplate(
          '{[this.formatSpReset(values.data.SpReset)]}',
          {
              formatSpReset: function(val) {
                  if(val === 1) {
                      return 'Yes';
                  }
                  // 其余情况返回空
                  return '';
              }
          }
      )
  }
  

说明：XTemplate中{[ ... ]}包裹的内容支持直接执行任意JS代码，可以直接访问当前渲染上下文的values对象，也能调用模板实例上挂载的自定义方法，灵活度和原生renderer没有区别。

两种写法配置完直接生效，TreeGrid渲染单元格时会自动把当前节点的完整数据传入模板上下文，字段取值逻辑和你原来的写法完全兼容，不会出现字段取不到的问题。

内容的提问来源于stack exchange，提问作者FrenkyB