Failed to switch skybox material

Questions
1

I assigned a material to a skybox during initialization, and when I tried to switch the material in another function, there was no error, but the material did not work, but the material did print out，Can someone tell me why, thanks

    initBabylon(canvas, idx) {
      let _this = this;
      this.engine = new BABYLON.Engine(canvas, true);
      const scene = new BABYLON.Scene(this.engine);
      const camera = new BABYLON.FreeCamera(
        "Camera",
        new BABYLON.Vector3(-77.595, 41.452, -236.725),
        scene
      );

      camera.attachControl(canvas, true);
      camera.ellipsoid = new BABYLON.Vector3(1, 1, 1);

      camera.wheelPrecision = 10;
      _this.lighter = new BABYLON.HemisphericLight(
        "light",
        new BABYLON.Vector3(1, 1, 0),
        scene
      );
      this.skybox = BABYLON.MeshBuilder.CreateBox(
        "skybox",
        { size: 1000.0 },
        scene
      ); 
      const skyboxmat = new BABYLON.StandardMaterial("skyboxmat", scene); 
      skyboxmat.backFaceCulling = false;
      skyboxmat.reflectionTexture = new BABYLON.CubeTexture(
        "src/assets/img/",
        scene,
        [
          "myp8qtsn0p_small.jpg",
          "myp8qtsn0p_small.jpg",
          "myp8qtsn0p_small.jpg",
          "myp8qtsn0p_small.jpg",
          "myp8qtsn0p_small.jpg",
          "myp8qtsn0p_small.jpg",
        ]
      );
      skyboxmat.reflectionTexture.coordinatesMode = BABYLON.Texture.SKYBOX_MODE; 
      _this.skybox.material = skyboxmat; 
      console.log('_this.skybox.material', _this.skybox.material)
      var modelNow;
      if (idx == 0) {
        modelNow = "/src/model/SmartBuilding.glb";
      } else if (idx == 1) {
        modelNow = "/src/model/1.glb";
      } 
      BABYLON.SceneLoader.ImportMesh("", modelNow, "", scene, (meshes) => {
        const model = meshes[0];
        model.ellipsoid = new BABYLON.Vector3(0.5, 1.0, 0.5);
        model.ellipsoidOffset = new BABYLON.Vector3(0, 1.0, 0);
        model.type = "main";
        _this.scene.addCamera(camera);
        _this.scene.createDefaultEnvironment();
        _this.scene.collisionsEnabled = true;
        _this.scene.checkCollisions = true;

        camera.speed = 0.4;
        camera.inverseRotationSpeed = 1;

        camera.setTarget(model.position);
        camera.rotation = new BABYLON.Vector3(Math.PI / 25, Math.PI / 25, 0);
        _this.sceneModel = meshes;
        _this.modelLoaded = true;
      });

      this.engine.runRenderLoop(() => {
        scene.render();
      });
      window.addEventListener("resize", () => {
        this.engine.resize();
      });
      this.camera = camera;
      this.scene = scene;
    },
    changeLight(light) {
      let _this = this
      let scene1 = this.scene
      this.lighter.diffuse = BABYLON.Color3.Black();
      const skyboxmat = new BABYLON.StandardMaterial("skyboxmat", scene1); //创建材质
      if (light == "evening") {
        skyboxmat.reflectionTexture = new BABYLON.CubeTexture(
          "src/assets/img/",
          scene1,
          [
            "Evening.jpg",
            "Evening.jpg",
            "Evening.jpg",
            "Evening.jpg",
            "Evening.jpg",
            "Evening.jpg",
          ]
        );
      } else {
        skyboxmat.reflectionTexture = new BABYLON.CubeTexture(
          "src/assets/img/",
          scene1,
          [
            "myp8qtsn0p_small.jpg",
            "myp8qtsn0p_small.jpg",
            "myp8qtsn0p_small.jpg",
            "myp8qtsn0p_small.jpg",
            "myp8qtsn0p_small.jpg",
            "myp8qtsn0p_small.jpg",
          ]
        );
      }
      _this.skybox.material = null
      console.log('_this.skybox.material', _this.skybox.material)
      _this.skybox.material = skyboxmat
      console.log('_this.skybox.material', _this.skybox.material)
      scene1.render();
      this.scene = scene1
    },
2

Why are you calling render here? Do you have the render loop turned on? If not, the textures and materials are not ready here, and calling render won’t get the results you want.

3

Since I want to re-render a new scene, I turn on loop rendering in initBabylon. I just tried:

  1. Turn on loop rendering in this step
  2. Assign a value directly and remove the rendering step (since loop rendering is turned on in initBabylon)After these two steps, it is still impossible to switch materials
4

Can you setup a repro in the Playground?

5

this: https://playground.babylonjs.com/#0CJD12#2

6

This does not run at all could could you try to focus on reproing only the current issue in the PG ?

7

It should be OK now： https://playground.babylonjs.com/#HZDK9M#2

The problem may lie in the giving of materials. When I write this on the Playground, I can successfully switch, but I can’t get materials when I write the following form. And in my code written in the following form can be successfully given at initialization.

So still can’t load another material (confirm material exists)

skyboxmat.reflectionTexture = new BABYLON.CubeTexture(
          "src/assets/img/",
          _this.scene,
          [
            "Evening.jpg",
            "Evening.jpg",
            "Evening.jpg",
            "Evening.jpg",
            "Evening.jpg",
            "Evening.jpg",
          ]
        );
8

Now that I have solved this problem, I have changed the way the image is loaded to the array form, can successfully switch, Thank you all for your help,hope can help others with the same problem

const skyList = [
          "/Evening.jpg","/Evening.jpg", "/Evening.jpg", 
          "/Evening.jpg","/Evening.jpg", "/Evening.jpg",
        ]
        skyboxMaterial.backFaceCulling = false
        var reflectionTexture = new BABYLON.CubeTexture.CreateFromImages(
          skyList,
          scene1
        )
        reflectionTexture.coordinatesMode = BABYLON.Texture.SKYBOX_MODE
        skyboxMaterial.reflectionTexture = reflectionTexture
        this.skybox.material = skyboxMaterial