<view class="canvas-container">
<!-- 主渲染画布 -->
<canvas
type="webgl2"
class="three-canvas"
id="Canvas2"
will-read-frequently="true"
></canvas>
mounted() {
this.$nextTick(() => {
this.initThreeJS();
});
},
initThreeJS() {
// 获取canvas并初始化适配器
adapter.useCanvas('#Canvas2').then(({ canvas, requestAnimationFrame }) => {
this.canvas = canvas;
this.platformRequestAnimationFrame = requestAnimationFrame;
// 更新canvas尺寸
this.updateCanvasSize();
// 创建场景
this.scene = new THREE.Scene();
this.scene.background = new THREE.Color(0x000000);
// 添加光源
const ambientLight = new THREE.AmbientLight(0xffffff, 0.8);
this.scene.add(ambientLight);
const directionalLight = new THREE.DirectionalLight(0xffffff, 1.0);
directionalLight.position.set(5, 10, 7.5);
this.scene.add(directionalLight);
················
详细报错:TypeError: Cannot use 'in' operator to search for 'promise' in MiniProgramError
invalid selector
Error: invalid selector
报错在adapter.useCanvas('#Canvas2').then(({ canvas, requestAnimationFrame })这句话
使用的threejs库是minisheep/three-platform-adapter
我将界面作为单独的界面,通过onReady()初始化 就没有任何问题 3d模型可以正常显示出来
尝试使用过wx.createSelectorQuery().in(this)也有报错,会报错在创建渲染器位置
this.renderer = new THREE.WebGLRenderer({
canvas: canvas,
antialias: true,
preserveDrawingBuffer: true
});
THREE.WebGLRenderer: n.addEventListener is not a function,问了ai说是
这个错误通常发生在 Three.js 的 WebGLRenderer 初始化时传入了无效的 DOM 元素
