JS: Bagaimana untuk membina objek berdasarkan sifat induk
P粉883223328
P粉883223328 2024-04-04 21:08:50
0
1
1508

Saya cuba mencipta objek JS yang mengandungi semua URL.

Saya mahu mencapai ini melalui bahagian data():

export default defineComponent({
  name: 'MyPage',
  data() {
    backendUrls: {...}
  }
})

Melihatnya dengan cara yang lebih mudah, ia akan kelihatan seperti ini:

backendUrls: {
  baseUrl: "http://localhost:8080",
  baseUrlWithPrefix: function() { return this.baseUrl + "/ver1"; }
  userAdd: function() { return this.baseUrlWithPrefix() + "/user/add"; }
}

Saya boleh menggunakan kata kunci this kerana ia menunjuk ke objek yang sama dengan harta yang diberikan.

Tetapi saya mahu membelahnya lagi dan mencipta objek dalam objek:

backendUrls: {
  baseUrl: "http://localhost:8080",
  generalUrls: {
    baseUrlWithPrefix: ...
  },
  socketUrls: {
    messageUrls: {
      userAdd: ...
    }
  }
}

Di sini, jika saya mencuba generalUrls: { baseUrlWithPrefix: function() { return this.baseUrl + "/ver1" }}, ia tidak akan berfungsi kerana ia tidak menemui baseUrl , kerana kata kunci generalUrls: { baseUrlWithPrefix: function() { return this.baseUrl + "/ver1"; }},它不会起作用,因为它找不到baseUrl,因为this关键字指向generalUrls对象,而不是backendUrls对象,baseUrl menghala ke objek generalUrls, bukan objek backendUrls, di mana baseUrl wujud.

Saya memerlukan sesuatu seperti ini:

backendUrls: {
  baseUrl: "http://localhost:8080",
  generalUrls: {
    baseUrlWithPrefix: function() { return {goBackToParentObject}.this.baseUrl + "/ver1"; }
  },
  socketUrls: {
    messageUrls: {
      userAdd: function() { return {goBackToParentObject}.this.generalUrls.baseUrlWithPrefix() + "/user/add"; }
    }
  }
}

P粉883223328
P粉883223328

membalas semua(1)
P粉432930081

Hanya ubah cara anda memanggil fungsi seperti berikut

const backendUrls = {
  baseUrl: "http://localhost:8080",
  generalUrls: {
    baseUrlWithPrefix: function() { return this.baseUrl + "/ver1"; }
  },
}

const example = backendUrls.generalUrls.baseUrlWithPrefix.bind(backendUrls);

example();
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!