Penggunaan params dan pertanyaan dalam vue

Dalam Vue, param dan pertanyaan digunakan untuk mengakses serpihan penghalaan dinamik dan parameter rentetan pertanyaan. Objek params mengandungi nilai serpihan laluan dinamik, manakala objek pertanyaan mengandungi pasangan parameter dan nilai dalam rentetan pertanyaan. params adalah sebahagian daripada laluan, tetapi pertanyaan tidak, yang mempengaruhi padanan laluan. Anda boleh mengakses param dan pertanyaan melalui objek $route dan menggunakannya untuk menghantar data semasa menavigasi.

Penggunaan params dan query dalam Vueparams 和 query 的用法

在 Vue 路由中，params 和 query 是两个密切相关的概念：

params

params 对象包含当前路由的动态片段的值。动态片段是在路由的路径中使用 : 前缀的命名片段，如 /user/:id。

const User = {
  template: '<p>User ID: {{ $route.params.id }}</p>'
}

当路由匹配 /user/123 时，$route.params 将包含以下对象：

{ id: '123' }

query

query 对象包含当前路由查询字符串中的参数。查询字符串是 URL 中 ? 号后面的参数和值对，如 ?page=2&sort=desc。

const SearchResults = {
  template: '<p>Page: {{ $route.query.page }}</p>'
}

当路由匹配 /search?page=2&sort=desc 时，$route.query 将包含以下对象：

{ page: '2', sort: 'desc' }

区分 params 和 query

params 和 query 之间的一个关键区别是，params 是路由的一部分，而 query 不是。这意味着 params 会影响路由匹配，而 query 不会。例如，路由 /user/:id 只会匹配具有有效 id 参数的 URL。但是，/search 路由将匹配任何带有或不带有查询字符串的 URL。

使用 params 和 query

你可以通过 $route 对象访问 params 和 query 对象。对于导航，可以使用 $router.push 或 $router.replace 方法，这两个方法都支持传递 params 或 query 对象。

// 使用 params 导航
this.$router.push({ name: 'user', params: { id: '123' } })

// 使用 query 导航
this.$router.push({ name: 'search', query: { page: 2, sort: 'desc' } })

总结

params 和 query

Dalam penghalaan Vue, params dan query ialah dua konsep yang berkait rapat: 🎜🎜🎜params🎜🎜params objek mengandungi nilai serpihan dinamik laluan semasa. Serpihan dinamik dinamakan serpihan yang diawali dengan : dalam laluan laluan, seperti /user/:id. 🎜rrreee🎜Apabila laluan sepadan dengan /user/123, $route.params akan mengandungi objek berikut: 🎜rrreee🎜🎜query🎜🎜 objek query mengandungi parameter dalam rentetan pertanyaan laluan semasa. Rentetan pertanyaan ialah parameter dan pasangan nilai selepas nombor ? dalam URL, seperti ?page=2&sort=desc. 🎜rrreee🎜Apabila laluan sepadan dengan /search?page=2&sort=desc, $route.query akan mengandungi objek berikut: 🎜rrreee🎜🎜Bezakan antara param dan pertanyaan🎜🎜Perbezaan utama antara params dan query ialah params ialah sebahagian daripada laluan, manakala query > tidak. Ini bermakna params mempengaruhi padanan laluan, tetapi query tidak. Contohnya, laluan /user/:id hanya akan memadankan URL dengan parameter id yang sah. Walau bagaimanapun, laluan /search akan sepadan dengan mana-mana URL dengan atau tanpa rentetan pertanyaan. 🎜🎜🎜Menggunakan params dan pertanyaan🎜🎜Anda boleh mengakses objek params dan query melalui objek $route. Untuk navigasi, anda boleh menggunakan kaedah $router.push atau $router.replace, yang kedua-duanya menyokong lulus params atau query objek. 🎜rrreee🎜🎜Ringkasan🎜🎜params dan query ialah konsep penting dalam penghalaan Vue dan digunakan untuk mengakses serpihan laluan dinamik dan parameter rentetan pertanyaan. Memahami perbezaan antara keduanya adalah penting untuk menggunakan penghalaan Vue dengan berkesan. 🎜

Atas ialah kandungan terperinci Penggunaan params dan pertanyaan dalam vue. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!