How to create a cube with a different color on each side in v8.x.x

[Owliang]

Hi,

I'm trying to create a cube with a different color on each side.

With this code,

    <mesh ref={mesh}>
      <boxBufferGeometry attach="geometry" args={[2, 2, 2]} />
      <meshBasicMaterial attachArray="material" color="#00FF00" />
      <meshBasicMaterial attachArray="material" color="#FF0000" />
      <meshBasicMaterial attachArray="material" color="#0000FF" />
      <meshBasicMaterial attachArray="material" color="#FFFF00" />
      <meshBasicMaterial attachArray="material" color="#FF00FF" />
      <meshBasicMaterial attachArray="material" color="#00FFFF" />
    </mesh>

I can do this in @react-three/fiber v7.0.29, example,
but when I change to v8, all side has the same color, which is the last color in the mesh. In this case, it's "#00FFFF"

Not sure how to do this in v8, any suggestions?

Dependencies

    "@react-three/fiber": "7.0.29", //not work if using "8.0.20"
    "react": "18.1.0",
    "react-dom": "18.1.0",
    "react-scripts": "5.0.1",
    "three": "0.141.0"

[MarcoCuel]

I'm also having the same problem

[drcmda]

attach="material-0" ...
attach="material-1" ...

[meshachDe]

Thank you so much, this worked

[Owliang]

Easier than I thought, thanks!

[m7mdtiger]

I am also having the same issue.
And I'm using "@react-three/fiber": "^8.10.0"

Using 'attach' ended up with no colors at all!
And I keep on getting the last color in the mesh for all sides when I use attachArray!

<boxGeometry attach="geometry" args={[2, 2, 2]} />
<meshBasicMaterial attachArray="material0" color="#00FF00" />
<meshBasicMaterial attachArray="material1" color="#FF0000" />
<meshBasicMaterial attachArray="material2" color="#0000FF" />
<meshBasicMaterial attachArray="material3" color="#FFFF00" />
<meshBasicMaterial attachArray="material4" color="#FF00FF" />
<meshBasicMaterial attachArray="material5" color="#00FFFF" />

Please, any idea why this is happening !?

[m7mdtiger]

It points out that the dash '-' is so important here xD

<meshBasicMaterial attach="material-0" color="#00FF00" />
<meshBasicMaterial attach="material-1" color="#FF0000" />
...

Thank you ^^