three.js，透明模型能够遮挡可见模型

本人在开发眼镜试戴的AR项目中，遇到一个问题：当脸部转动的时候，眼镜镜教部分会直接盖在脸上，使得试戴体验并不好。翻阅很多资料后发现，可以通过透明模型遮挡的方法来遮住镜脚。说白点就是在场景中放置一个人头模型，人头跟着脸部旋转，这样，旋转切换模型的时候，镜脚如果被人头模型遮住，镜脚就不会被渲染。
如此，假如glasses为眼镜，head为人头。
glasses模型需要遍历一下所有的mesh并设置renderOrder的值大于0，使其能够先于透明模型（head）被渲染（模型默认的renderOrder = 0）；

  glasses.traverse(function (obj) {
    if (obj.type === 'Mesh') {
      obj.renderOrder = 1;
    }
  })

随后再调整head如下
 

  head.traverse(function (obj) {
    if (obj.type === 'Mesh') {
      obj.material.colorWrite = false;    // 重点是这段代码
      obj.material.side = THREE.DoubleSide;    // 是否双面渲染看具体需求，加不加问题不大
    }
  })

后面head没有设置renderOrder是因为默认的就是0了，无需再重复设置。但是如果有需要的话，得保证head的renderOrder小于glasses的renderOrder。