javascript - Gunakan VUE2.0 untuk mencapai kesan berikut

Question

Alamat halaman web Saya telah belajar VUE sendiri baru-baru ini dan ingin menggunakan VUE untuk membuat sesuatu. Kemudian saya dapati contoh laman web peribadi di Internet yang saya ingin laksanakan bahagian laman web di mana saya klik pada tajuk artikel untuk memasukkan butiran artikel. Adakah mungkin untuk menggunakan vue-router? Tolong berikan saya pendapat anda, terima kasih!

高洛峰 · Answer

Jika saya diminta untuk melakukannya, saya akan menggunakan penghala Kerana butiran artikel yang berbeza secara umumnya konsisten dalam gaya, jadi saya biasanya menulis komponen terperinci untuk masalah lulus nilai, saya biasanya lulus id artikel . Saya ada lebih kurang tiga kaedah

Sambungkan parameter permintaan ke dalam url, sama ada sebagai laluan atau param

Urus melalui bas

Simpan ke vuex untuk pengurusan

给我你的怀抱 · Answer

Gunakan vue-router, anda boleh menambah acara klik, dan kemudian memanggil kaedah ini.$router.push untuk melompat laluan, dan anda juga boleh lulus parameter.
Beri saya contoh:

Acara klik tajuk artikel:

//name是路由的名字也可以用path，query中是参数，放在url中
this.$router.push({name: 'MemberMenu', query: {id: 233, title: 'hello'}})
//url: xxx.com/MemberMenu?id=233&title=hello

Dapatkan parameter dari halaman butiran artikel:

    // 获取url参数
    getUrl (name) {
      let reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)')
      let r = window.location.search.substr(1).match(reg)
      if (r !== null) {
        // 解决乱码问题
        return decodeURIComponent(decodeURI(r[2]))
      }
      return null
    }