Bandingkan nama pembolehubah dan ID butang untuk memuatkan kandungan secara dinamik dalam ThreeJS
P粉301523298
P粉301523298 2024-02-21 20:27:15
0
1
430

Saya menggunakan Three.js untuk memuatkan berbilang model 3D dan menyimpannya dalam tatasusunan di latar belakang. Saya mempunyai berbilang butang dengan ID unik yang menambahkan model khusus itu ke tempat kejadian. Sekarang saya ingin membandingkan ID butang dan nama pembolehubah supaya saya boleh memuatkan model tertentu sahaja dan mengalih keluar mana-mana model lain yang ditambahkan pada tempat kejadian. Saya menulis gelung untuk gelung melalui semua pembolehubah untuk dibandingkan dengan ID butang yang diklik, tetapi saya tidak boleh mengakses hanya nama pembolehubah untuk membandingkannya dengan ID butang.

Ini kod saya:

function modelShow() {

  let m;

  var models =  [mandi_0, maxi_0, mandi_1, maxi_1, mandi_2, maxi_2];

  for (m = 0; m < models.length; m++) {

    if(models[m].name == event.target.id){
      scene.add(models[m]);
    }
    else {
      scene.remove(models[m]);
    }
  }
}

let j;

for (j = 0; j < buttons.length; j++) {
   buttons[j].addEventListener('click', modelShow);
}

Bagaimana untuk membandingkan hanya nama pembolehubah dengan ID butang, tanpa membandingkan kandungan di dalam pembolehubah?

P粉301523298
P粉301523298

membalas semua(1)
P粉615886660

Gunakan objek dengan nama sifat yang dikira dan bukannya tatasusunan.

const modelsByName = {
  mandi_0,
  maxi_0,
  mandi_1,
  maxi_1,
  mandi_2,
  maxi_2,
};

Kini anda mempunyai objek seperti modelsByName["mandi_0"] === modelsByName.mandi_0 === mandi_0 dan sebagainya untuk pembolehubah lain. Tetapi kerana anda tidak menggunakan tatasusunan, anda tidak boleh lelaran mengikut indeks lagi, jadi tukar gelung.

for ( let key in modelsByName ) {
  if ( modelsByName.hasOwnProperty( key ) && key === event.target.id ) {
    ...
  } else {
    ...
  }
}
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan