动态改变颜色三个js不是实时的

Question

我正在尝试创建一个 3d 配置器

我想像这样使用颜色选择器更改特定材料的颜色

$('#color-block').on('colorchange', function() {
    var newColor = $(this).wheelColorPicker('getValue', 'rgb');
    setColor(\'' + newColor + '\');
})

和我的setcolor 函数是这样的

function setColor(color) {
    update_svg('color', color);
}

function update_svg(op, value) {
    if (op == 'color') {
        document.getElementById(selectedMaterial).setAttribute("fill", value);
    }
    if (op == 'ftext') {
        document.getElementById(selectedText).innerHTML = value;
    }
    if (op == 'ff') {
        document.getElementById(selectedText).setAttribute('font-family', value);
        document.getElementById(selectedText).style.fontFamily = value;
    }
    if (op == 'fs') {
        document.getElementById(selectedText).style.fontSize = value;
    }

    //PLS SEE THIS
    set_materials(function (resp) {
        obj = object.children[0]?.material;
        obj += textureMaterial;
        render();
    });
}

但是无论我选择哪种颜色，3d 对象的颜色都不会实时改变，如果我在 3d 对象完全加载之前更改颜色，颜色就会改变。我给你一个不是PLS SEE THIS 我更改的代码

set_materials(function (resp) {
        object.children[0].material = textureMaterial;
        render();
    });

但该代码给了我一个错误

Uncaught TypeError: Cannot set property 'material' of undefined

这就是我添加? 的原因，所以有人知道为什么吗？这是我第一次使用三个js

编辑

我创建了 stackblitz，所以你可以看到我想说什么

https://stackblitz.com/edit/js-sqdsoq?file=javascript%2Fmain_s.js

你可以检查openColorPicker函数我认为问题在那里

Answer 1

material.needsUpdate = true

...接下来将在动画循环中渲染提供的颜色值，假设颜色设置为支持的格式。

最好通过使用 getObjectByName()...（[或类似的访问器]）遍历场景（或组）的后代来选择对象（或其子对象）。不保证 [0] 数组索引存在，或者是预期的对象。