Tulis semula tajuk sebagai: Cara menghantar data daripada Node.js menggunakan SSR dalam Vue 3-Soal Jawab Rangkaian PHP Cina

Artikel Topik pembelajaran Muat turun Soal Jawab Kamus Pengaturcaraan Permainan kemas kini terkini

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

Tulis semula tajuk sebagai: Cara menghantar data daripada Node.js menggunakan SSR dalam Vue 3

P粉078945182 2023-08-25 18:42:30

492

Saya sedang membina tapak web menggunakan vue.js 3 dan saya mahu menggunakan pemaparan sebelah pelayan. Saya juga mahu dapat menghantar data ke vue.js 3 dari pelayan fastify (atau ekspres) saya. Adakah terdapat cara saya boleh melakukan ini (saya melihat sesuatu yang dipanggil pautan express-vue: github, tetapi ia untuk vue 2 dan bukan rasmi, jadi saya tidak tahu sama ada ia bagus)? Dan bolehkah anda memasukkan penghidratan pelanggan, kerana saya melihat beberapa contoh seperti https://github.com/moduslabs/vue3-example-ssr tetapi ia tidak termasuk penghidratan pelanggan, jika ini tidak mungkin saya akan gunakan ejs, tetapi saya lebih suka vue 3. Bolehkah anda memberi saya contoh atau templat? Terima kasih terlebih dahulu!

P粉078945182

membalas semua (1)

P粉3365367062023-08-26 09:55:40 Tingkat 1

Anda boleh menterjemah kandungan di atas ke dalam bahasa Cina:

您可以将上下文对象传递给renderToString函数
 const context = { data: 'Hello world' } // 您想要共享的数据 const html = renderToString(App, context) 
 在Vue组件中，可以使用useSSRContext来访问此对象
 setup() { if (typeof window === 'undefined') { const context = useSSRContext() console.log(context.data) // Hello world } } 
 与Vue 2不同，您无需在
中添加data-server-rendered="true"，当您在浏览器上使用createSSRApp而不是createApp时，Vue 3会自动进行客户端渲染
 
 要在浏览器中传递对象，您需要在从服务器返回结果时将其写入中的window变量中
 const html = renderToString(App, context) res.send(`    
 ${html}
   `)