javascript - Gunakan VUE2.0 untuk mencapai kesan berikut

Question

Alamat 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?

Sila berikan saya pendapat anda, terima kasih!

Answer 1

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 2

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
    }